jQuery モバイルを使用するモバイル Web サイトを持っていますが、モバイル デバイスでの CSS の読み込みに問題があります。Jellybean を搭載した私の Nexus S では、HTML の読み込みは非常に高速ですが、CSS の読み込みには 3 ～ 4 秒かかります。その間、Web サイトは次のように表示されます。
モバイル Web サイト自体は、http://axialdev.ekomobi.comにあります。
CSS ファイルは上部にリンクされていますが、最後に読み込まれるようです。色と表示スタイルを含むものは と呼ばれclient-damafro.min.cssます。
私のやり方に明らかな問題はありますか？読み込みの問題を解決するにはどうすればよいですか?
これは直観に反するように聞こえるかもしれませんが、頭の css の直後にスクリプトを配置できますか。
これにより、最初にすべての「もの」がロードされ、次に html がロードされます。jsが適用される前の素早い点滅を回避します....
完全なページをコンピューターに保存して変更することで、ローカルで試してみましたが、うまくいくようです...
乾杯
ロビン
Ps: 最後に、ロード スクリプト全体を無視しています。私はそれを知っています...
まず、すべての CSS を縮小します
私もあなたのJavaScriptを縮小します
Google Chrome Developer Tools をチェックすることをお勧めします
最後に、jQuery および jQuery Mobile の JavaScript ファイルを css ファイルの直後にロードするように移動します。
<link rel="stylesheet" href="/css/responsive.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
<script type="text/javascript" src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
jQM はアプリのルック アンド フィールを制御するため、最初に HTML をロードしてから CSS を適用しているため、これらを最初にロードするのに役立つ場合があります。
私には、css などを配置するという点で、あなたは正しいことをしているように思えます。その提案によると。または、すべての css を本番用の 1 つのファイルにマージし、このツールを使用して圧縮することもできます http://www.cleancss.com/
すべての javascript(requests) をコードの末尾の終了タグの直前に配置し</body>、DOM の準備が整った (ロードされた) ときにスクリプトが開始されるようにします。
別のアイデア: 自分のサーバーで jquery-mobile ライブラリをホストしてみてください。