Experts.jp日本に、もっとエキスパートを。2013/11/01-2013/11/30>今月の定点観測は、モバイル開発で考慮したいオフラインファースト構想について、レスポンシブウェブデザインに対する別視点、コンポーネントレベルでのプログレッシブ・エンハンスメントのアプローチなど合計20件の記事や動画などを紹介します。First!モバイル・ファーストをさらに一歩進め、”不安定なインターネット接続”や”バッテリー”というモバイルならではの問題を解決に導くためのオフライン・ファーストというアプローチが注目を浴び始めている。そのタイミングで議論のスタートポイントとなるべく作られたのがこのサイト。具体的な活動は始まっていないようですが、これから多くの議論が期待されるトピックなので目が離せません。Sizeレスポンシブウェブデザインにおけるゴールに世にあふれている様々なデバイスにデザインを適応させることがあげられると思います。Wroblewski氏は、その適応に向けた指標となっているスクリーンサイズはデザインを決定づけるのに十分な変数にはなりえないと指摘しています。Glassから見ているかを知ることも難しいでしょう。Wroblewski氏は、スクリーンサイズに適応することが無意味であるわけではないが、考慮するべき指標ではないかと結んでいます。browsersブラウザやバージョンによる機能の違いを吸収するためのアプローチを行うのにブラウザやバージョンにグレードを設定し、そのグレードごとの対応を行うアプローチが多く採用されています。Jehl氏は、ブラウザにグレードをつけるのではなく、サイトを構成するコンポーネントにグレードを設けて、それごとにどのように機能を拡張していくかを定義していくアプローチを提案しています。Jehl氏は、コンポーネントごとにグレードを設けることで、ドキュメントしやすく、もっとも最適な体験を各ブラウザ、デバイスに提供するというゴールを達成しやすいとしています。Shof氏による素晴らしい回答。この回答を導いた質問も素晴らしく、”もしピカソが絵の書き方を学ぶ際、我々がどのように書くべきかを示唆したとしたら、キュービズムは存在したのか?”、というものです。これに対してShof氏は、チームとして、または大きなコードベースをメンテナンスする上では、どんなスタイルであろうと一貫性を持つことが重要であるとしながらも、個人でサイドプロジェクトを行う際にはもちろん無視しても構わないとしています。Asm.jsAsm.jsを利用することでJavaScriptでもネイティブに限りなく近いパフォーマンスを得ることができます。実際にそのデモは目を見張るほどのパフォーマンスを出しています。Wittens氏は、Asm.jsを含むLLVMのような”JavaScriptのふり”をする存在の登場はJavaScriptそのものにプラスにならないとしています。browsers.モバイル向けのウェブサービスを制作するにあたり課題であり、現在多くの革新が起こっている分野の一つであるリモート・デバッグについて、ブラウザごとに異なるデバッグ用APIを作るのではなく、共通化することができないか、という目的を体現するための構想。ビジョンそのものも素晴らしいですが、実際に公開されているブリッジとなるツールの紹介もあるので実利的でもあります。Testingモバイル開発における悩みの1つに非常に多くのデバイスで動作・表示確認を行う必要があることがあげられます。CCなどを詳しく紹介しています。registryNode.jsに関わるツールを利用する際、なくてはならない基本的なツールとなっているnpm。そのnpmregistryを支えるインフラは実はNodejitsuにより無料で提供されています。registryが不安定になる事象が起こり、その解決のための寄付を募っています。現時点でゴールは達成(残21日)していますが、Node.jsを普段から利用しているなら寄付を検討してみてはいかがでしょうか。noneCSSによるシャドウの描画はブラウザにとってやや不得意な操作であり、それが原因でスクロールパフォーマンスの低下につながることも多い。この記事では:hoverにつけられたシャドウによるパフォーマンス低下を防ぐ手法について紹介しています。Seddon氏が紹介した方法はiframeではうまくいかないと指摘、この問題に関してはハックに頼らずブラウザ側で解決することが期待されるとしています。ToolsWebGLを使う際に知っておきたいデバッグツール、そしてパフォーマンスのプロファイルツール達の紹介。Editorの紹介を含む4つ(+アルファ)のツールについて紹介しています。Syntax、通称src-Nについて、これまでのsrcsetと比較して、このシンタックスがシンプルなのかについての解説をしています。Lawson氏がまとめています。これまでの経緯を含めて今後に関する示唆を含む非常に有用な記事となっています。Souders氏が解説。McDonnell氏がよく使う方法を抜き出して詳しく解説。コードサンプルはRubyのものになっているが、JavaScriptやその他の言語でも同じアプローチができるので非常に参考になります。JavaScriptウェブアプリの構築にアジャイルのような早い開発サイクルに適した選択としてフロントエンドはもちろん、サーバーサイドでもJavaScriptを採用するケースが増えてきています。この記事ではそのアプローチでツールスタックを構築する際に知っておきたい様々なことを包括的に紹介しています。すべてに対する回答ではありませんが、注目のアプローチではあるので要チェックです。Templateウェブデザインに限らずですが、色がユーザに与える影響は計り知れません。その大切な色に関して覚えておきたい基礎と応用について平易な用語を使って非常にわかりやすく解説しているサイト。リファレンスとしていつでも参照できるようにしておきたいサイトです。Osmani氏による、レンダリング・パフォーマンスに関する203ページに及ぶスライド。FlickrやPinterest、Google+などの実際のウェブサービスを対象にしたケーススタディとなっています。Resig氏が作成したブラウザ上でsteamについて学べるこのツールを試してみてください。詳しい利用方法についてはこちらの記事を参考にしてください。Gruber氏によるLevelDBを使ったリアルタイムチャットについてのビデオ。氏は15分の発表中に(ごく単純なものですが)実働するチャットシステムをライブコーディングをしています。完成したソースコードはGitHubにて公開されています。Groupによりオープンソースされている、Pa11yは自動でアクセシビリティに関するレポートを収集し作成してくれるツール。★次回の「斉藤祐也の海外WEBテク定点観測」は2014年1月6日にお届け予定です。