html5 アプリ開発フレームワークには、1. jquery mobile、2. bootstrap、3. ionic、4. Mobile Angular UI、5. Intel XDK、6. Appcelerator Titanium、7. PhoneGap などがあります。
このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
HTML5 モバイル開発のためのモバイル APP 開発フレームワークのトップ 10
jquery モバイル フレームワーク
bootstrapフレームワーク
#Appcelerator Titanium フレームワーク
jQuery Mobile
は、携帯電話およびタブレット デバイス用のjQuery のバージョンです。 
jQuery Mobile は、
コア ライブラリを主流のモバイル プラットフォームに導入するだけでなく、完全で統合された jQuerymobileUI フレームワークもリリースします。世界の主流のモバイル プラットフォームをサポートします。 2.bootstrap フレームワーク
#Bootstrap は
HTML に基づいています、CSS
、JAVASCRIPT
Web の開発を迅速化します。これは、Twitter デザイナー Mark Otto と Jacob Thornton によって開発された、CSS/HTML フレームワークです。 Bootstrap は、動的 CSS 言語 Less で記述されたエレガントな HTML および CSS 仕様を提供します。 Bootstrap は、発売後非常に人気があり、NASAMSNBC(Microsoft National Broadcasting Corporation など) GitHub で人気のオープン ソース プロジェクトとなっています。 ) の 速報ニュース はすべてこのプロジェクトを使用しました。 WeX5 フロントエンド オープン ソース フレームワークなど、国内のモバイル開発者に馴染みのある一部のフレームワークも、パフォーマンス最適化のための Bootstrap ソース コードに基づいています。 3.ionic フレームワーク
##Ionic は強力な HTML5
HTML、CSS
、Javascript
Web テクノロジーを使用してネイティブに近い構築を支援するアプリケーション開発フレームワーク モバイル アプリを体験する。 Ionic主に外観とエクスペリエンス、および UIアプリケーションとのインタラクションに重点を置き、特に Hybird パターンに基づく HTML5 モバイルに適していますアプリケーション開発。 4.Mobile Angular UI フレームワークMobile Angular UI は、ブートストラップ 3 と AngularJS を使用したレスポンシブなモバイル開発 HTML5 フレームワークです。 #Mobile Angular UI
1. Bootstrap 3
2. 
AngularJS
Bootstrap 3 Mobile コンポーネント (
、overlays、
bootstrap では使用できません。
AngularJS モジュール (angular-route、angular-touch、angular-animate# など) # #レスポンシブ メディア クエリは、別のファイルとして bootstrap になっており、必要なものだけを含める必要があります。
には jQuery 依存関係が含まれていません。必要なのは、いくつかの AngularJS 命令を通じてフレンドリーなユーザー エクスペリエンスを作成することだけです。 5.Intel XDK Framework
##Intel は、以下に基づいて最初のバージョンをリリースしました。 web 開発者が
および iOS 用のモバイル アプリケーションを開発するのに役立つプログラミング ツール。このフリー ソフトウェアは
Intel XDK と呼ばれ、実際には今年 2 月に Intel
が買収した AppMobi
HTML5 に基づくアプリケーションを開発し、モバイル デバイスで使用できます。 6.Appcelerator Titanium フレームワーク
Titanium はモバイル プラットフォームに依存しない開発フレームワークで、ローカル アプリケーション エフェクト アプリケーションを使用して Web を開発するために使用されます。現在、主に iPhone および Android 携帯電話をサポートしています。
##Sencha Touch フレームワークは、
に基づく世界初の Mobile App フレームワークです。 Sencha Touch を使用すると、Web アプリ を ネイティブ アプリ のように見せることができます。美しいユーザー インターフェイス コンポーネントと豊富なデータ管理は、すべて最新の HTML5 および CSS3WEB 標準に基づいており、Android および # と完全に互換性があります。 ##Apple iOS デバイス。モバイル端末上で動作するアプリケーションを迅速に開発できる豊富なWEB UIコンポーネントを提供します。 8.Kendo UI フレームワーク
Kendo UI のあらゆる側面 すべて強力な 
JavaScript アプリケーション パフォーマンスを提供するためにゼロから構築されました。
は別の jQuery UI クローンではなく、そのすべての決定はパフォーマンスの最適化に基づいています。 jQurey テンプレートよりも大幅に高速に実行される軽量の組み込みテンプレート ライブラリから、CSS3 ハードウェア アクセラレーションによる (可能な場合) 最適化されたアニメーションと高度な仮想化ユーザー インターフェイス、##Kendo UI# まで## 高パフォーマンスのクライアント UI を提供するために努力を惜しみません。 9.PhoneGap フレームワーク
##クロスプラットフォーム開発ツールについて言うと、多くの人はまず次のように考えます。 PhoneGap について考えてみましょう。開発者が
HTML、JS
、CSS
iOS、Android、BB10、Windows Phone から Amazon Fire OS、Tizenなど、すべての主要な主流モバイル プラットフォームが利用可能であり、開発者は位置情報、アクセラレータ、連絡先、音声などの主要な携帯電話機能を最大限に活用することもできます。 業界の主流のモバイル開発フレームワークの多くは、PhoneGap から派生しています。より有名なものは、Worklight、appMobi、WeX5
WeX5 は中国で構築されており、完全に Apache オープンソースであり、Phonegap の統合に基づいて深く最適化されており、に近い機能を備えています。 ネイティブ アプリ パフォーマンスと開発の利便性。 10.mui フレームワーク
APP エクスペリエンスに最も近いパフォーマンスフロントエンド フレームワークには次の特徴があります。
軽量
パフォーマンス エクスペリエンスの追求が、
プロジェクトを開始する際の主な目標です。軽量 これは重要な機能であるはずです。
はサードパーティの JS ライブラリ、圧縮された
JS および に依存しません。 CSS ファイルは
と 60 Kネイティブ UIこれまでの多くの点を考慮すると、ファイルはわずか 100 K と 60 Kフロントエンド フレームワーク (特に React スタイルのレイアウト フレームワーク) では、
コントロールは Web ページに似すぎていてネイティブな雰囲気がないため、ネイティブな UI な雰囲気を追求することも重要です私たちの目標
MUI iOS プラットフォーム UI に基づいており、Android プラットフォーム
UI コントロールが追加されています。 #スムーズなエクスペリエンス
プルして更新
プルダウンの更新機能を実現するために、ほとんどの H5 フレームワークは div を通じてプルダウンのリバウンド アニメーションをシミュレートします。 android 携帯電話では、div アニメーションが頻繁にフリーズします (特に画像とテキストのリストの場合)。mui はデュアル webview を使用することでこの問題を解決します。 div のドラッグの流暢性の問題。ドラッグするときにドラッグされるのは div ではなく、完全な webview (subwebview##) #)、リバウンドアニメーション ネイティブアニメーションを使用します。
webview モードと div モード。どちらのモードにも独自の長所と短所があり、さまざまなシナリオに適しています。各サイドスライド実装モードには、さまざまなサイドスライド アニメーション効果があり、主に 4 つのカテゴリに分類されます。 アニメーション 1: メイン インターフェイスが移動しますが、メニューは移動しません
モバイル アプリケーション (特に
iOS のリスト コントロールもサポート スライドして操作メニュー機能をトリガーするには、DOM 構造体を特定の形式に従ってアセンブルするだけで済みます。さらに、スライドはイベント トリガーもサポートしており、開発者はスライディング イベント (slideleft/slideright) を監視できます。操作前に確認リマインダーを完了してください。 推奨学習: HTML5 ビデオ チュートリアル
以上がHTML5アプリ開発フレームワークとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
