1

jQueryモバイルウェブアプリを高速化しようとしていますが、Googleでページキャッシュについて知りました。それが何をするのかについての適切な詳細な説明を見つけることができないように思われるので、なぜそれが正確に悪いのかについて誰かが光を当てることができますか？多くの人がそれをオフにしたいと思っているようです。

私の主な質問は（私が思うに）これに関連しています-基本的に私はアプリの起動時と各ページの読み込み時に非常に多くのHTMLをさまざまなページに挿入する多くのjs関数を持っています。たとえば、スライドショーページをロードすると、ページロードでスライドショーがロードされるため、常にDOMに含まれるわけではありません。これはすべてのページに対して行うべきことですか？HTMLが多すぎると、一般的なアプリの速度に非常に大きな違いがありますか？

私は8ページのそれぞれのコンテンツをすべて非表示にすることを考えていましたが、jsを使用して各ページの読み込み時にコンテンツを表示しましたが、これは価値がありますか？（そして、明らかにページハイドで再び非表示にします。）

これはどういうわけかページのキャッシュに関連していると思いますか？

また、複数ページのテンプレートを使用しているため、すべてのページが1つのHTMLファイルに含まれていますが、外部のjsライブラリが非常に多い場合は、このページを別のHTMLファイルにロードする方が理にかなっています。 HTMLとキャンバスのタグ/jsファイルに含まれているアプリの残りの部分を遅くするには???

ありがとう

4

1 に答える 1

3

ページのキャッシュを理解するには、jQueryMobileがページの読み込みを処理する方法を理解する必要があります。

1HTML/複数ページ

このソリューションはおそらく処理が最も簡単です。すべてが1つの大きなファイルに含まれているため、すべてを整理しておけば、それほど多くの問題が発生することはありません。ただし、大規模なWebアプリを作成している場合（特に、このWebアプリがphonegapフレームワークを介してモバイルアプリになる場合）、このソリューションは多くの問題を引き起こします。

これは1つの大きなファイルであるため、jQueryMobileはすべてをDOMにロードします。これにより、トランジション効果が速くなり、同時にWebアプリが肥大化します。

デスクトップブラウザ専用のWebアプリを作成している場合、これが解決策です。それ以外の場合は、そこから実行します。

複数のHTMLテンプレート

このテンプレートは、モバイルデバイスに適しています。1つのHTMLページのみがDOMにロードされ、前のすべてのページがDOMから削除されます（特別に定義されていない限り）。このソリューションではページ遷移に問題が発生する可能性がありますが、大きなHTMLファイルを作成しない限り問題にはなりません。

ajaxでロードされたページのみがDOMにロードされます。したがって、すべての新しいHTMLファイルがロードされ、すべての古い/前のファイルが削除されます。

ページキャッシュ

複数のHTMLテンプレートソリューションを使用している場合は、一部のページをプリフェッチできるため、遷移の問題を防ぐことができます。

ページの読み込み機能を使用して、ページをプリフェッチできます。

$.mobile.loadPage( pageUrl, { showLoadMsg: false } );

または、次のように、ページdivコンテナ内にdata-dom-cache="true"属性を配置します。

<div data-role="page" id="cacheMe" data-dom-cache="true">

自動ページキャッシング

このプロパティを使用して、モバイルレベルでキャッシュをオン/オフにすることもできます。

$.mobile.page.prototype.options.domCache = true;

または次のように無効にします：

$.mobile.page.prototype.options.domCache = false;

このプロパティは、mobileinitイベント内にロードする必要があります。

$(document).bind("mobileinit", function(){
    $.mobile.page.prototype.options.domCache = true;
});

このプロパティは、1HTML /複数ページのテンプレートでは使用できません。

これについての詳細は、公式ドキュメントで見つけることができます：http: //jquerymobile.com/demos/1.0rc2/docs/pages/page-cache.html

于 2013-03-11T23:14:07.517 に答える