【ITニュース解説】Lazy Loading: Do you really know what it is?

Lazy Loading（遅延読み込み）は、Webページの表示速度を改善するための技術。Webサイトの仕組みの変化と合わせて理解することで、より深く理解できる。

初期のWebサイトは、複数のページで構成される「MPA（Multi Page Application）」が主流だった。ユーザーがページを移動するたびに、サーバーから必要なHTML、CSS、JavaScriptなどが読み込まれる仕組み。

その後、「SPA（Single Page Application）」が登場。SPAは、Webサイト全体を1つのページとして構築し、JavaScriptを使ってコンテンツを動的に書き換えることで、ページ遷移時の読み込み時間を短縮しようとした。しかし、SPAでは初回アクセス時に大量のJavaScriptファイルをダウンロードする必要があり、初期表示速度が遅くなるという問題が発生。

この問題を解決するために登場したのが、Lazy Loading。Lazy Loadingは、画像やJavaScriptなどのリソースを、初期表示に必要なものだけを読み込み、それ以外のリソースは、ユーザーがスクロールしたり、特定の操作を行ったタイミングで遅延して読み込む技術。これにより、初期表示速度を改善できる。

さらに、Lazy Loading以外にも、Code Splitting（コード分割）という技術も登場。Code Splittingは、JavaScriptのコードを複数のファイルに分割し、必要なファイルだけを読み込むことで、初期ロード時間を短縮する。

近年では、SSR（Server Side Rendering）という技術も注目されている。SSRは、WebページのHTMLをサーバー側で生成し、クライアントに送信する。これにより、SEO（検索エンジン最適化）を向上させることができる。Next.jsやRedwoodJSなどのフレームワークは、SSRを容易に実装できる。

そして、Webサイトの構築方法は、MPAからSPAへ、そしてLazy LoadingやSSRを経て、再びMPAに近い形に戻りつつある。これは、技術の進歩によって、MPAの欠点であったページ遷移時の遅延が解消されつつあるため。

Lazy Loadingなどの技術がWebサイトの表示速度向上に貢献しているのは確かだが、コンピューターの性能向上も無視できない。数十年前のコンピューターで現在のWebサイトを閲覧すると、その差は明らか。ハードウェアの進化も、Webサイトのパフォーマンス向上に大きく影響している。

このように、Webサイトの構築方法は、技術の進歩や課題解決の繰り返しによって変化。Lazy Loadingは、SPAの問題点を解決するために生まれた技術だが、Webサイトの歴史の中で、その役割も変化してきている。