私は自分のサイトの折りたたみ部分の上にあるほんの少しのツイッターブートストラップフレームワークを使って上記のフォールドコンテンツを最適化するように私のウェブサイトを設計しましたフォールドの下にスライスアップツイッターブートストラップでページの読み込み速度を向上させる
コンテナクラスのいくつかの要素を縮小した浮動ナビゲーションバーを使用しました。これは、フォールドの上にロードされたすべてのtwitterブートストラップコンテンツです。
bootstrap.cssファイルを編集して、それらの部分を取り出し、HTMLページの頭にインライン化してから、CSSの残りの部分を遅らせることができます。
私の質問;ツイッターのブートストラップを編集し、ブートストラップを破壊することなく最初にロードするために必要な部分を取り除くことは可能ですか？
これは、ごくわずかな場合に頭痛を引き起こすようなマイクロ最適化です。
あなたは、1日に何百万人ものユーザーにサービスを提供しているコンテンツを一度に表示しているのでなければ（そして、実際にはトンを意味しますが、その場合はサイトを簡素化します）、あなたは提案しています。
あなたができることは、あなたが最適化する方法と方法について賢明なことです。まず、サイト全体でBootstrapの特定の部分のみを使用している場合（つまり、Modalsを使用しない場合）、自分のウェブサイトからBootstrapのカスタムビルドを作成します。これにより、ファイルのセットが少なくなるため、ユーザーにワイヤを少なく送って、サイトをスピードアップします。
また、大量のライブラリを使用している場合は、既存のCDN（コンテンツ配信ネットワーク）を使用することもできます。これは、多くの人々が使用している単一のURLからのjs/cssファイルを提供します。これは、自分のサーバーからコンテンツを提供する必要はなく、誰かにリンクするだけでなく、良いチャンスですユーザーが同じCDNを使用していたサイトにアクセスした場合、そのブラウザはブラウザをキャッシュして、のいずれかのネットワークコールなしで表示されることになります。今それは速いです！
最後に、このようなことを考える前に、最適化することをあなたに任せておくとよいでしょう。 YSlow pluginとベストプラクティスをよくご覧ください。あなたのサイトを最適化するために、「折りたたみ部分の上」のコンテンツのためだけにブートストラップをハックすることなく、たくさんのことがあります。
ありがとう、非常に詳細な答えは、私が問題を整理するのに間違いなく助けになりました。 – user1610950
はい、もちろんOKです。 –
これらをインライン展開すると、処理が遅くなります*。キャッシュされたCSSファイルの場合は1回ではなく、ページビューごとにすべてのCSSを送信します。これは実際には物事を扱うには本当に悪い方法です。 – ceejayoz
@ceejayoz nginxはキャッシュをかなりうまく処理しますが、折りたたみの上にロードされた部分を小さくして、その部分をWebページのヘッダーに配置し、残りの部分を遅延ロードします。 – user1610950