ページのレンダリングを改善する

Be Yours には、最初のページの読み込みを大幅に高速化する機能が付属しています。

このページでは

• 仕組み
• 長所と短所

仕組み

通常、ブラウザはページ上のほぼすべての要素をレンダリングします。たとえトップにいたとしても、ページの下部にある部分は依然として関与しています。

しかし、もうそうではありません。 content-visibilityと呼ばれる新しい CSS プロパティが登場しました。これらの複雑な用語は無視してもよいでしょう。視覚化するために、この手法では、ページの要素がビューに表示される直前まで、その要素のレンダリングをスキップします。この機能は Be Yours に統合されました。レイアウトの多いセクションなど、特定のページ セグメントのレンダリング作業を延期し、表示される直前になったときにのみレンダリングするようにブラウザーに指示できます。

長所と短所

これにより、ページ内検索や SEO を損なうことなく、長いページのレンダリング コストを削減できるのは明らかです。ドロップシッピング ストアと、製品やコレクションを表すホームページ上の多くのセクションがあると想像してください。または、ランディング ページに大量の画像が埋め込まれている一種のショーケース ストアであり、この技術はこうしたケースに有益です。

ただし、この手法には制限やバグもあります。ページをスクロールすると、スクロールバーがかなりギザギザになっていることがわかります。これは、レンダリングされる新しいコンテンツに合わせてページ コンテンツが調整されていることです。また、レンダリングされていない要素はレイアウト内で高さが失われるため、マウスのスクロールに応じてコンテンツが少し遅れて表示されることがあります。

この手法は完全な互換性がないことに注意することも重要です。現在、Firefox と Interner Explorer ではサポートされていません。

さらに支援が必要です

BeYours テーマに関して問題が発生した場合、または追加のサポートが必要な場合は、8 時間以内にチケット システムを通じてサポート担当者にご連絡ください。

以下の QR コードをスキャンして WhatsApp コミュニティに参加し、最新情報、ニュース、お知らせを入手してください。