Frontrend/chrome

Tokyo, 30th October 2013

Frontrend x Chrome


イベント名 Frontrend x Chrome Tech Talk Night Extended
日時 10月30日(水)19:00 - 23:00 (18:00開場)
会場 渋谷マークシティ13F セミナールーム
定員 300名
講師 Addy Osmani, Jake Archibald, Paul Irish
主催 株式会社サイバーエージェント
参加費 無料
事前登録 必要
タグ #frontrend
備考 スクール形式(一部机あり)、逐次通訳あり

Lightning Talks

  • WebPagetest in 5 minutes @kojismt
    いまいち日本では人気のないと思われるWPTの紹介・Speed Indexの意味について紹介。
  • Try Web Components @hiloki
    Addyの素晴らしい記事を参考にしながら、WebApp向けのコンポーネントを何かつくってみます。その結果どういうものができたか、またどういった点が難しいかというのをお話します。
  • Solving the big picture of testing Android devices @gunta85
    多くのAndroid端末を個別に検証しなければならない課題を解決するべく立ち上がった、STF(仮)という開発中のプロジェクトを簡単なデモで紹介します。
  • JavaScript Can Fly! @cssradar
    As Jeff Atwood stated, "Any application that can be written in JavaScript, will eventually be written in JavaScript."I will talk about my experience flying a "Nodecopter" via JavaScript. Playing with a hardware using JavaScript is not so new anymore, yet it is a whole new world for me!

The Mobile Web Development Workflow

今日のモバイルウェブ、すべてのデバイスでなめらかな60fpsのパフォーマンスを得ながら、素晴らしいユーザ体験を実現することは非常に難しい挑戦だ。今回のセッションでは、モバイルウェブ・アプリにおける開発そのもの、テスト、そして、パフォーマンス解析に利用できるツールの世界に飛び込んでいく。ターゲットとしているモバイルデバイスからすぐにフィードバックを得ながら開発するためにはどうするのがベストなのか、そして、難しいパフォーマンスに関する決断を後になってしないためにどのように複雑性の規模拡張を行うべきかについて紹介。

また、ローカル、クラウドの環境におけるデバイステストの全ての可能性について考察していく。このセッションで、モバイルウェブに関わるツールについて盤石の概観を見渡すことができるようになり、プロジェクトでより自信を持ってタスクをこ なせるようになるはずだ。

The Mobile Web Development Workflow from Frontrend on Vimeo.

Addy Osmani @addyosmani

AddyはGoogle Chromeデベロッパー・リレーションチームとして、開発者の生産性と満足度を向上させるためのツールについてフォーカスしている。彼は開発者のワークフローを自動化するツールであるYeomanのリード・エンジニアであり、Chrome DevToolのコントリビュータであり、モバイルウェブに関わるツールの改善に向けて邁進している。

Googleの外では、AddyはTodoMVCのようなオープンソースプロジェクトに貢献したり、執筆にいそしんでいる。彼はこれまでにJavaScriptのデザインパターンについて、とフレームワークについての本の執筆をし、次のSmashing Bookではモバイルウェブにおけるレンダリングパフォーマンスについての章を担当している。


Rendering without lumpy bits

新たなプロジェクトが始まった。500,000pxを計算し、描画しなければならない。デッドラインは16.67ミリ・セカンド。それが終わったら、もう1度繰り返す。そしてもう1度。Webパフォーマンスとは常にピクセルを時間内に供給することだ。しかし、目標は変わってきている。純粋にJavaScriptの最適化(例えば、ループや、文字列連結、あるいは計算そのもの)を行うことは関係なくなりつつある。DOM、レイアウト、そしてGPUを利用したインタラクションからパフォーマンスの向上策を見つけ出すようになってきた。

今回のセッションでは、現実的なレンダリングの問題から、どうやってその問題を解決していくべきなのか、どうしてある特定のハックが有効なのになるのかを探り、そして、時にブラウザにとって不利益なことをどのようにチューニングするべきかを紹介していこう。HTMLレイアウトやアニメーションの基礎、GPUを利用したインタラクション、そしてRetinaのような高解像度ディスプレイを持つブラウザやデバイスにおける注意点についても紹介。

Rendering without lumpy bits from Frontrend on Vimeo.

Jake Archibald @jaffathecake

JakeはGoogle Chromeデベロッパー・リレーションチームとして、仕様、テストの実装、そして開発者達の日々の仕事がすこしでも楽になるようなツールを持っているか、などについてフォーカスしている。彼はレンダリングにかかる時間の最適化、プログレッシブ・エンハンスメント、そしてレスポンシブデザインに関わる全てについて熱烈なファンでもある。

JakeはGoogleの前職ではLanyrdでモバイルWebサイトを製作し、BBCではJavaScriptのライブラリと標準化について担当していた。Web以外では、F1とおいしいビールが大好き。


Mobile Web Developer Tools

モバイルウェブは急成長を続けている中、デベロッパツールもまた同じように変化し続けている。今回のセッションで、PaulはChromeのデベロッパツールを使って、どう効率的にパフォーマンス解析、バグ修正、そして、いかにサイトの開発を素早く行うのかについての概要に触れていく。様々なパフォーマンス・テクニック、リモート・デバッグのセットアップの方法、そして実機がない場合にどのようにモバイルの機能をエミュレートしていくかについて紹介。

Mobile Web Developer Tools from Frontrend on Vimeo.

Paul Irish @paul_irish

Paul IrishはChromeのデベロッパ・アドボケート担当。氏は常に、ツールを使って生産性を高めるワークフローについて考え、どのようにより洗練され、セクシーなモバイルウェブ・アプリを制作できるかを突き詰めている。氏はModernizrYeomanHTML5 PleaseCSS3 Pleaseを始め、様々なオープンソースプロジェクトにも取り組んでいる。

このイベントは終了しました。