SPAとはシングルページアプリケーションの略です。
何がシングル(単一)なのかっていうことなんですが、webサイトは画面毎にそれぞれページが用意されていて、ボタンを押したりリンクを踏んだりすると、そのサイトが存在する地球上のどこかしらにあるサーバーまでその押された先のページ取りに行って、あなたが見ているスマホなりPCなりに送り返し、画面に表示される仕組みになっています。
そのページが一つしかないのがSPAと呼ばれるものです。
しかしそう聞くと一枚ペラで殆ど情報が無い昔のwebサイトを思い浮かべるかもしれませんが、そういうことではありません。
SPAだと最初に一つのページとそれに付随するデータやパーツをドカッと送るようになっているのです。
そして今までは画面全体を切り替えて表示していたものを、画面一部だけパーツとして切り替えるのです。
その画面一部のパーツというのは最初にドカッと送られてきた中に存在し、あなたが見ているスマホの画面が所持しています。
そのため、あなたが何度も何度も画面を切り替えようとしても、いちいちサーバーに送ったり送り返されたりということが圧倒的に減るので、処理が軽くなるのです。
またそれ以外にも、今まで以上に高度な表現が出来ることや、webサイトなのにwebアプリの様に利用できるといったメリットがあります。
利用している有名なサイトはgoogle、ツイッター、Facebook、Netflixなどなど、使っている人はあまり意識しませんが結構あります。
一方でSPAを導入する大きなデメリットとして、最初にドカッと送るので初回読み込みに時間が掛かるというものがあります。
そのため、長時間滞在する様なサイトの方が導入のメリットは大きいと言えます。
ちなみにSPA向けのJS FWとしてはAngular、React、Vue.jsなどが挙げられます。
フロントエンドエンジニアとして単価を挙げたいのであれば是非使えるようになりたいところです。
コメント