非同期通信により、高速でシームレスなページ遷移を実現

10068 views
約2分
商品名pushState + Ajax
ジャンル非同期通信、負荷軽減
価格オープンプライス
リリース時期2020年春
その他投稿オプションの「フリーメタ情報」として自由項目(最大5件)を指定すると、このように本文の先頭に自動表示されます。

本テーマでは、pjax (pushState + ajax)という技術を用い、非同期通信によってサイト内のページ遷移の処理を効率化し、ページ表示速度を通常のページ遷移に比べて圧倒的に高速化を実現しました。

通常、リンクをクリックしてサイト内の別のページに遷移する場合、遷移先のページのソース(HTML,Javascript,CSS等)を再び最初から読み込み、解析し、表示します。
しかし、最初にあるページを読み込んだ後は、CSSやJavascript、その他ヘッダーやフッター内のほとんどのコードはサイト内で共通のものであるため、サイト内で別ページを表示する際に、それらの共通するコードをまたはじめから読み込む処理は、本来不要な重複する処理を繰り返すためにレンダリングや通信負荷をかけてしまう原因となります。
この無駄を可能な限り排除するため、本テーマには、ページを表示する際に実際に更新が必要なメインコンテンツのソースと、一部のコードやメタタグのみをリフレッシュし、共通で利用できるヘッダーやフッターのソースは更新せずにページ遷移をする機能が搭載されています。

非同期通信ページ遷移デモ&速度比較


なお、この特定のページだけ非同期通信によるページ遷移を無効にしたいリンクがある場合は、対象のアンカータグに付与した任意のclass(セレクタ)をテーマオプションに登録しておくことで、 特定のリンクのみ pjaxによる非同期通信によるページ遷移を除外することも可能です。
もちろん、テーマオプションにて サイト全体でこのpjaxによるページ遷移機能を無効化することもできます。

About The Author

digipress.incプロデューサーDigiPress サポート
これはユーザーのプロフィール情報エリアです。
肩書きや対象ユーザーのSNSアカウントのリンク、紹介文などをWordPressのプロフィール画面から登録するだけで自動的に表示されます。

また、各プロフィール情報はMicrodata形式として出力されるため、検索エンジンにも寄稿者として認識させることができます。

Comments

コメントはまだありません。

FacebookでシェアTwitterでシェアPinterestでシェア