SPAについて

SPA Single Page Applicationはブラウザによる画面遷移を行うことなく、単一のWebページでコンテンツの切り替えを行うことでWebサイトの動作が向上したり、高度なWeb表現ができたりと最近注目されている。

縦長スクロールのものなども見かけるが、途中で何か選択して一部画面が変わったりしてもスクロールするストーリーは継続できる。

SlackやFaceBookなどは、入力して登録しても他の部分は影響を受けずに必要部分だけ更新される。
Webアプリケーションというより普通のアプリケーションのような感じ。

実際、スマホのネイティブアプリのように扱われることもある。PUSH機能も用意できるらしい。

しかしながら、SPAは習得コストが相当高い。
私としては、SPAを学ぶくらいなら、ネイティブアプリの習得に時間を割くべきと考える。
だいたい、そんな複雑なシステムが必要なサイトを作る機会など、まずないと思う。

とはいえ、昨今では、SPAとはいえないまでも、画面遷移のない滑らかな動きのサイトもある。
今後、ホームページをつくるのであれば、WordPressを使うか、オリジナルで作成するなら、画面遷移のない動きのページが地味にカッコイイ。

ReactとかVueとかはSPAを作成するためのフレームワークなので、これらを使えばもちろんできる。

Larvelのlivewireを利用すると、簡単な物なら、javascriptを一切書かずにphpだけで作れる。
見えないところで、Alpine.jsというVue.jsの軽量版のようなjsが生成されているとのこと。

サンプルを作ってみたが、最近はインターネット回線も速いし、パソコンも速いので、画面が変わらないことを実感しにくい。
なので、動画を掲載してみたところ、一部画面を切り替えても動画が途切れないので、画面遷移がないことを実感できた。

クリックした回数はMySQLに書き込んでいるが、自然に更新される。
javascriptだけだと、データベース更新しても遷移がないというのは難しいかも。