promise の概要 (JavaScript による Windows ストア アプリ向け)

Windows ストア アプリを JavaScript で記述する場合、非同期 API を含む処理を記述しようとすると、その種類にかかわらずすぐに promise (英語) と呼ばれるコンストラクターに遭遇します。間もなく、連続する非同期操作で自然にプロミスのチェーンを使うようになります。 また開発作業の中では、実際にどのような処理が行われているか完全には理解できないような promise の使用方法に出会うことも珍しくありません。そうした例が、HTML ListView のパフォーマンス最適化のサンプル (英語) にある、ListView コントロールのアイテム レンダリング関数の最適化です。これに関する記事も今後公開する予定ですが、//build 2012 で Josh Williams 氏が説明した WinJS の Deep Dive (英語) も参考になります (多少変更されています)。 list.reduce(function callback (prev, item, i) { var result = doOperationAsync(item); return WinJS.Promise.join({ prev: prev, result: result}).then(function (v) { console.log(i + ", item: " +…

1

jQuery Version 2.0 での Windows ストア アプリのサポート

既に Web 開発の経験をお持ちなら、オープン ソースの JavaScript フレームワーク、jQuery を使用されたことがあるかもしれません。また、jQuery を使用して Windows ストア アプリの構築を試されたことがあるなら、JavaScript ランタイムまたは動的なコンテンツに関するエラーが発生したのではないでしょうか。今度の v2.0 リリースでは、jQuery チームはこれらの問題に取り組みました。jQuery v2 ベータでは、HTML5/JS による Windows ストア アプリの開発がサポートされます。皆さんは、Web 開発者としてお持ちのスキルとアセットを使用して Windows 8 用のすばらしいアプリを開発することができます。最新の jQuery 2.0 ベータ ビルドで今すぐお試しになれます(英語) 「jQuery チームは、jQuery 2.0 を使用できる新しい環境に興奮を覚ています。HTML 開発者、JavaScript 開発者は、このような環境で jQuery に関する知識を得て、作業場所にとらわれずに開発プロセスを効率化したいと期待を寄せています。jQuery 2.0 は、Windows 8 ストア アプリケーションなどの環境でこのような期待に応えることができる機能を提供します」- jQuery Foundation 理事長、Dave Methvin Windows ストア アプリ: JavaScript コードでの異なるコンテキスト 皆さんは、jQuery は以前どうして “まったく機能しなかった” のか不思議に思われているかもしれません。Windows…


JavaScript 用 Windows ライブラリ (WinJS) を使ってカスタム コントロールを構築する

JavaScript を使って Windows ストア アプリを開発されたことがあれば、JavaScript 用 Windows ライブラリ (WinJS) をお使いになったことがあるのではないでしょうか。このライブラリには、Windows ストアの UX ガイドラインに従ったアプリをすばやく構築するうえで便利な CSS スタイル、JavaScript コントロール、およびユーティリティのセットが用意されています。WinJS が提供するユーティリティには関数セットが含まれており、これを使って開発するアプリのカスタム コントロールを作成できます。 JavaScript コントロールの作成には、任意のパターンやライブラリを使用できます。WinJS のライブラリ関数は、1 つの選択肢にすぎません。WinJS を使ってコントロールを構築する最大のメリットは、このライブラリの他のコントロールと整合性を保って連携できるカスタム コントロールを作成できる点です。カスタム コントロールの開発と操作のパターンは、WinJS.UI 名前空間の他のコントロールと同じです。 この記事では、構成可能なオプション、イベント、およびパブリック メソッドをサポートする、独自のコントロールを構築する方法を説明します。同様の XAML コントロールの開発にご興味がある場合は、近々公開予定の記事を参照してください。 HTML ページへの JavaScript ベースのコントロールの組み込み まず、WinJS コントロールをページに組み込む方法を再確認しましょう。それには 2 種類の方法があります。1 つは強制的な方法 (暗黙的に JavaScript のみを使用して処理する方法) で、もう 1 つは宣言的な方法 (HTML 要素に属性を追加して、HTML ページにコントロールを組み込む方法) です。後者の場合、ツールボックスからコントロールをドラッグするなど、ツールを使って設計時のエクスペリエンスを提供できます。詳細については、「クイック スタート: WinJS コントロールとスタイルの追加」を参照してください。 この記事では、WinJS で宣言型の処理モデルによりメリットが得られる JavaScript…


ピクセルを最大限に活用する – 表示状態の変更に適応する

Windows 8 のアプリは、さまざまな画面サイズとさまざまな表示状態で実行されます。ユーザーは、25 インチのデスクトップ モニターの側端にアプリをスナップすることもできますし、10 インチのワイドスクリーン タブレットの画面全体をアプリで埋めることも可能です。いずれの場合も、皆さんのアプリが利用可能なスペースを十分に活用することが望まれます。この記事では、アプリの現在のサイズと表示状態をコードで追跡する方法と、画面サイズと表示状態の変更を処理するために Windows 8 Consumer Preview でアプリを記述する方法について、ヒントを示します。 //build/ では、さまざまな画面シナリオに合わせてアプリを設計する方法について説明しました。たとえば、XAML に関する講演 (英語) や HTML に関する講演 (英語) をお聞きください。最近の Building Windows 8 ブログでは、画面のスケーリングの調査と設計に関する私たちの考えを少しお伝えしました。多くの場合、明示的なコードを記述しなくても、純粋なマークアップを使って画面サイズの変更に対応できます。しかし、アプリの表示状態 (英語) を追跡し (つまり、アプリが縦長モード、全画面モード、フィル モード、スナップ モードのどれであるか)、それに応じて反応するようにコードを記述することが必要になる場合があります。たとえば、HTML の ListView を使ってアイテムを表示する場合、次の図に示すように全画面モードでは GridLayout を使いますが、スナップ モードでは ListLayout を使います。XAML の場合、GridView コントロールと ListView コントロールを同様に切り替えることができます。このための方法を理解するために、まずはサイズ変更と表示状態の変更をコードで検出する方法を見てみましょう。 左の全画面表示状態では、GridLayout (HTML) または GridView コントロール (XAML) が使われている。 右のスナップ表示状態では、ListLayout (HTML) または ListView コントロール (XAML)…