Web技術の歴史を振り返る
こんにちは、シニアソフトウェア エンジニアのriddleです。
こんにちは、ミドルソフトウェア エンジニアのひびのです。
このポッドキャストでは、僕たち2人で キャリアや普段の困りごとなどに関する
様々な話をして、IT業界のリアルを 届けようという趣旨の番組でございます。
今日特別編、原宿。
やったぜ。
久しぶりの原宿、そして物々しいスタジオ。 めっちゃ緊張する。
緊張してるんですか?
めっちゃ緊張してますよ。だって、 普段の収録環境と全然違いますもんね。
そうですね。
そして、今こういったWebクリエイター ポッドキャストデイっていう場を
用意していただいて、なんとおはがき いただいてるみたいなんですよね。
そうなんです。マキさんという方 からですね、ありがたいことに
おはがきをいただいております。
その中でですね、ポッドキャストを 続けられている秘訣みたいなところを
ちょっと聞いていただいたんですけども、 大変申し訳ないことにですね、
今回テーマを用意していまして、 ちょっとそこと兼ね合いと
収録時間の兼ね合いで、ちょっと申し訳ないですが、
ちょっと持ち帰らせていただいてですね、 別途専用回を設けますので、
ちょっとそちらで読ませていただきたいと思います。
マキさん、ごめんなさい。
後日アンサーさせていただきます。 そしていきましょう。
今日の特別テーマ。
10年後のWebサイトについて考える。
イエーイ。
イエーイ。
10年後。10年後ですよ。
10年後。今2025だから。
2035年。
2035年。
途方もないですね。僕が40歳になってる。
いいっすね。
リドルさんは?
今が36なんで、46ですね。
おお。IT業界で40代って言うと、 だいぶ、なんだろう、手だれですよね。
そうですね。今でもシニアって名乗ってるんで、 次はスタッフエンジニアって
名乗らないといけないかもしれないですね。
いや、僕もミドルが名乗れなくなるのか。つらいな。
そう。
とはいえ、じゃあ逆に言いますと、
10年前、たぶんリドルさんが本当に 新卒数年目くらいですかね。
そうですね。2015はそんな感じですね。
僕、大学生の頃ですね。
なんか10年前を語るにあたって、
あ、違う。10年後を語るにあたって、 10年前を知らなきゃいけないなと思って、
ちょっとまず懐かしみませんか、Web。
そうですね。調べてきました。 記憶が早いなんで。
2010年ぐらいからいきましょう。
2010年。いいですね。
実はですね、iPadの初代リリースで、
タブレット市場が本格化したのが2010年ぐらいですね。
そうか。それくらいの時期ですね。確かに。
そのくらいからモバイルのWebっていうのが 急速に進化してきたんですよ。
でた。そっか。僕、今思い出したんですけど、
それより前って使ってませんでしたか。iModeとか。
そう。EasyWebとかね。
EasyWebとか。僕らがパソコンで見るウェブサイトを
スマホじゃない、携帯電話で表示して、
ただ、本当にドム構造がめちゃめちゃ小さい画面で
表示されて操作しにくいけど、
あの頃はめちゃめちゃあれがありがたかったですよね。
そうなんですよ。そこから翌年、
WebSocketの標準化とかWebGLとか。
はいはいはい。ってことはWebSocketって
案外歴史が長い。
そうですね。15年ぐらい。標準化されてずっと使われてるんで。
そうですよね。まだそれこそ
いわゆるストリーミングの場面、
ストリーミング、あとサーバーサイドイベントとかだと、
なんか後継の技術は出てきているが、
まだまだ現役で使われてますもんね、WebSocketも。
確か僕らが運用してたサービスでも使ってた気がする。
あとは、エクマスクリプトの5.1公開。
エクマスクリプト5.1。
エクマスクリプト5.1っていわゆる
2015ですかね。
2011ですよ、エクマスクリプト5.1は。
そうか、それくらいの時代か。
まだまだつい最近まで現役で
ビルドターゲットとして使ってた気がする。
で、ちょっと飛んで2014年ぐらいに
HTML5。
あ、出た。HTML5。
そう、今は懐かしい。
懐かしいですね。でもこの頃から
セキュリティとプライバシーの重要性
確かあれですよね、ビデオタグとか。
オーディオとかね。
はいはい、オーディオタグありますね。
あとそれから
アーティクルとかいろいろ。
はいはいはい、セマンティックな
情報が増えてきましたね。
マークアップをしようね、みたいなのも増えてきましたよね。
それに合わせてですね、デバイスとかで言うと
4G、LTEみたいなもので
モバイルの帯域が向上して
スマホでもリッチな
Webの体験が得られるみたいなこともありましたね。
確かに確かに。
それで言うとちょうど同じくらいの時期で
日本でもスマートフォンは普及し始めましたよね。
そうですね、これ2014なんで
もう2年くらい前からもしかしたら
iPhoneとかはソフトバンクから出されたりとか
するんで。
確かに確かに、あれですね。
あとAndroidの市場も
2011年、12年くらいから日本では
広がってきたイメージですもんね。
そうですね。
その後はHTTP2が出たりとか
あとはLet's Encryptみたいなね
皆さんがお世話になっている
常時HTTPSみたいなものも出てきていて
もうほぼHTTPのサービスはもうないというか
ブラウザからも危ないですよって言われるくらいなんで
今となってはそうですね
Let's EncryptここでGAなんですね。
例えばTLSのいろんな
ハードブリードみたいな攻撃があったりとかで
TLS自体も危ないよねみたいな話になって
SSLの3.0はダメで
TLSの1.3みたいなものが登場したりとか
この辺りかな、2018
あとは5GとかWebAuth
WebAuth、あと5G
ファイド2.0みたいなね
いろいろ出まして
2020年あたりに
この辺はAppleのM1が出たのか
MWeb関係ないけど
その翌年にWebRTCの1.0が
W3Cで勧告されたとか
WebRTC、そうか。逆に言うとWebRTCはこの頃
勧告っていうことはRFCが作られたタイミングですね
いや違うか
RFCが
怪しい、ちょっとその辺ね
ちゃんとしたことは分からない
でもそう考えるとRPCって
意外と新しい技術
全然新しいですよね
Webソケットと比べて
でもこれ2021年なんで
ちょうどコロナがどうこうみたいな
時
あれですよね
オンラインのビデオチャットとかがめちゃくちゃ普及した時期なんで
この技術はだいぶ役に立ったんじゃないかなって感じですね
じゃあ逆に言うと
例えば2020年で僕らコロナで
多分在宅勤務を余儀なくされてましたよね
Google MeetとかZoomとか使って
常に仕事してましたよね
その頃もし中でWebRTCが使われてたら
まだ勧告されてなかった技術
そうか、だいぶ危ういな
逆にそういうので
必要性が高まってきたから
みんなで集まって仕様を決めよう
みたいになったかもしれないですよね
これは予想ですよ完全に
確かに世間的な
社会の動きが
W3Cを動かしている
面白いですね
翌年にHTTP3が標準化されましたと
いうところで
あとは近年は
WebGPUみたいな
WebGPU出た
ChromeでExperimentalみたいなURLを打ち込んで
わざわざ有効化しなきゃいけない技術ですね
あとちょっと
年代わかんなくなっちゃったけど
Webアセンブリーみたいなもので
Figmaとか
Amazonのプライムビデオとか
そういうところでリッチな体験を
より提供していくみたいなところが
Webだと今ホトトピックでありますよね
Figma
あとAmazonプライムビデオもなんですよね
今だいたいそれこそWebブラウザで
リッチな体験を提供しようとすると
避けられない技術になっている
感じはしますね
なので今までの歴史を振り返ると
大きく
6種類ぐらいあるかな
セキュリティ系がまず1個
HTTPSの話だったり
WebOSの話だったり
あと紹介しなかったですけど
プライバシー
サードパーティクッキーみたいな
それこそあれですね
ブラウザベンダーと
セキュリティを強化したいブラウザベンダーと
コンバージョンをしっかり取りたい
僕たちとのいたちごっこが
GDPRとかもあって
クッキーとかは
ユーザーに同意持たないとだめ
みたいなと
全てオッケーって画面と
全て拒否みたいな画面が最初に
Webフォーム数とよく出てくるようになりましたね
これ系って
ブラウザベンダーによってブロックされて
その代替の技術が出てきての
繰り返しですよね
あとは性能向上で
マイセテピ1.1から2.3
3が使ってるケースそんなに多くないと思いますけど
2は結構
使われてるかなと思いますし
CDNも結構盛んになってきて
いろんな会社が扱ってますよね
今後のWebの未来
それこそ今
個人レベルでウェブサイトを作るとしても
クラウドフレアに乗っかることとか
多いと思ってて
クラウドフレア使ってたらまず
CDNの恩恵は受けざるを得ない
そこでキャッシュですぐ返すとか
エッジロケーションで返すみたいなものも多いし
ネットワークで言うと4G 5G
6Gみたいなものも2030年を目安に
考えられたりとか
そういうのもあるんで
性能向上表現力で言うと
WebアセンブリーだったりWebGL GPU
とかWebSocket WebRTC
あとWebPushとか
サービスワーカー
PWAとか
いろんな技術が登場してますよね
標準化で
エクマスクリプトとかHTMLのGO CSS3とか
ブラウザは
Chromeが一興だったけど
Webオフのブレイブだったり
最新はPowerPlexiが出してる
Cometみたいな
AI搭載したブラウザだったり
みたいなものが登場してるっていうのが
ここ10年くらい変化かなと思います
なるほど
今ざっくりと
Webのこれまで
10年スパンで
歴史を振り返ってきましたね
はい
これからどうなるんでしょうね
例えば
僕最初に思ったのは
AIによるWeb体験の変化
まず検索
今リドルさんが
PowerPlexiの話をしてくれたと思うんですけど
今Google検索でも
初手なんだろう
例えば何々について調べたい
みたいなことを書いたら
一番最初のトップにも
AIによるサマリーが出てくるようになってますよね
そうですねジェミニーが回答してくれますよね
うんうんうん
そうなると
多分最初の予想としては
自分たち自身が
Webサイトを訪れるっていう体験は
今後少なくなっていきそう
うんうん
代わりにAIが
コンテンツを取ってきて
解釈するっていうところを仲介する
がより加速しそうな気がしますよね
そりゃそうですね
ありましたよね
CDNがユーザーに対して
お金を代わりに払わないと
AI Botからのアクセスは禁止しますよ
みたいな
確かにそうですよね
そうだな
それこそ商業向けのWebサイト
とかならAIに紹介されて
こそ価値を持つ
時代だとは思うんですけど
そうだな
学術的な論文を置いている
レポジトリとかはもう一定
お金を払わないと参照させない
は今後加速しそうですね
そうですね
そのアクセス数に応じて
その研究者の方の
評価が上がるなら
言っていいかなと思うんですけど
無料でもね
しかるべきコストは
どっかが払ってほしいまさにユーザーなのか
間のエージェントなのか
確かにそれで言うと
あれですよねそれこそ10年前だと
僕らがWebサイトを作る
そこに例えば
Google AdSenseとか
Amazonの広告を乗っけて
そのコンバージョンで僕らにも
収益が返ってくるっていう
仕組みが主流だったじゃないですか
今もそうかもしれないですけど
それが今後AIに
参照されることで
何かしらの収益が
Webサイトを運営している人に
買えるっていう仕組みにはなっていくでしょうね
エッジ技術の重要性
そうですね結構本質的ですよね
書いたものに対してダイレクトに
お金が入るっていうのは
確かにそうなるとですよ
そうなるとですよとはいえ
今でもSEOっていう概念が
あるじゃないですか
Google検索の上位に乗っかる
その結果いろいろな人が
そのコンテンツに輸入する
PVが増えて
広告へのコンバージョンが増えて
言ってみたら
Google検索の上位に
乗っかってくること自体が
収益に繋がりやすいっていう現状ですよね
そうですね
てことはAIに向けての
検索しやすさ
もう全部マークダウン
オンリーでリティUIなし
マークダウン
JSなし
あれじゃないですか結局
安倍寛さんのウェブサイトが一番強い
になってしまう
クライアントサイドレンダリングはもうだめ
なるほど
SSGのみ
それこそ今
例えばリアクト
僕らがよくウェブサイトを構築するのに
使うJavaScriptの
UIライブラリですね
リアクトにおいても
一つずつあるのはサーバーサイドレンダリング
ですね
サーバー側でリアクトのコンポーネントを
使って
HTMLのDOM構造をレンダリングして
それを返す
それ
AIに向けても
AIフレンドリーなウェブサイトになる
っていう解釈にはなりそうですね
そうですね
AIだと特に速度が人間よりも
求められると思うんですよ
そうなるとやっぱり
動画とか重い動画とか
そういうのはCDNからだったとしても
返さないほうが
いい気がしてて
なるほど
確かにそれだと
例えばウェブサイトで主要なコンテンツとして
見せたいものが画像だったとすると
AIからの
プリフェッチにおいては
画像自体は
返さずに
画像についている
ピクチャータグの
データとかそういうのを返す
イメージタグの
オルトテキストみたいなものを返すみたいな
そうかじゃあ結局
SEO
フレンドリーだと言われてやってきたことを
そのまま続けると
そんなに変わらない
確かにあれですもんね
考えてみたら
Googleのクローラーボットが
情報を取りやすい
っていう形式と
AIが情報を取りやすいって
大きく変わらなさそうな気がしますもんね
人とは
違いますけど
ボット感はあんまり差なさそうですよね
確かに確かに
なるほど
確かに
ちょっと話戻すんですけど
ボットから
AIが
こういうものを調べてくれない
っていうリクエストを受けて
各ウェブサイトに情報を
取りに行くわけですよね
そうですね
今僕らも
ChatGPTなりGeminiを触ってて
思うんですけど
AIからの返答が
例えば
30秒以上かかってしまうとかなると
その分離脱が増えそうですよね
そうですね
さすがに30秒は待ってらんないですもんね
そういう意味では
例えば
Google Botってあるときから
一定JavaScriptもレンダリングしてくれるよ
レンダリングして
その中のテキストを解釈してくれるみたいな
仕組みにはなってると思うんですけど
なんかもはや
そこのベストプラクティスは
一定また意味をなさなくなってきて
もっと早く
もっと早く
なりそうですね
もっと配布してほしいですもんね
確かに
ChatGPTとかもそうですけど
推論モデルが結構ベースだったりすると
推論のために1回フェッチしてみたいな
そうすると推論の段階が
どんどん深くなればなるほど
フェッチ回数も増えるんで
1回あたりのフェッチは可能な限り早い方が
利用者的には嬉しいですよね
そうですね
もちろんキャッシュとかしてるんでしょうけど
ウェブサイト側でのキャッシュは
ウェブサイトじゃない
AI側でのキャッシュ
それこそあれかもしれないですね
今ブラウザに
例えば画像を返すときに
これくらいの期間
キープアライブを設定しておいて
その間はブラウザの側で
画像をキャッシュしておいてくださいね
みたいなオプションあるじゃないですか
あれは
AI向けのオプションとかも
今後生まれそうな気がしますよね
ChatGPTのほうで
キャッシングしておいてください
全然ありそうですけどね
でも画像って
どこまで使うんだろうな
情報として
でかいから
確かに
それこそこういう画像ですっていうのを
メタタグぐらいのレベルじゃなくて
ちゃんと説明できるぐらいの
文章として
表現して
それをそのままAIに返すみたいな
ほうが
分かりやすいかなと思いますね
確かに確かに
そうかもしれないですね
残り時間が少なくなってきている
やばいまとめねば
他ないですか
大丈夫ですか
他そうだな
でも今の話を聞いてて
僕話したかったのは
さっきクラウドフレアの話したじゃないですか
今クラウドフレアワーカー
エッジの技術ですよね
ユーザーに一番近いコンピューターから
レスポンスを返すみたいな
それはやっぱり
速度にも寄与する
そういう技術の上で
ウェブサイト自体を構築するっていうのは
今後起こりそうですね
今でもやってる会社とかありそうですけどね
そうですね
それこそクラウドフレアでよく使われている
炎みたいな
ありますねライブラリ
あれ今
リアクトでのレンダリングとか
炎JSX
言ってみたら
HTMLの構造を
クラウドフレアワーカー上で
定義しておいて
レンダリングして返すみたいな
技術もあるので今後確かに
浸透しそう
まとめると
アクセス経路が
ユーザーがチャットGPTのような
チャット系のツールを使って
チャットGPTとかが
代わりにブラウザ
ウェブサイトにアクセスするパターンと
ユーザーが推奨された
ウェブサイトを直接開いて
ブラウザで見るパターンと
2パターンに大きく分かれて
後者のウェブブラウザでそのまま見る方向は
そんなに変わらない
もちろんUIが
AIをベースにした感じの
フレンドリーな感じになる
っていうのもあるでしょうけど
そこは進化するでしょうただ一方で
AIからのBotからのアクセスについては
より
データを削ぎ落として
レテンシーとか制限した上での
アクセス方式ができるような感じで
サイトとかが今後構築されていく
っていうかその2パターンを考慮しないといけない
っていうのがフロントエンドだったり
バックエンドのエンジン考えないといけないところですかね
あともう一つはやっぱり
広告に頼る収益モデルというよりは
AI検索に頼る収益モデル
っていうのもすでに導入されている
かもしれない今後さらに導入されそうな
気がしますね
だからその辺のマネタイズについては
業界W3Cなのかどっか分かんないですけど
そういうところの
考えるやつに乗っかって
それをうまくやってくれるプラットフォームを
使うみたいな
収益モデルの変化
スライフとかなのか分かんないですけど
ありそうだな
そういうところからちょっとウォッチしていきたいですね
ということで今回は
Webの10年ぐらい前の歴史から
今後10年なのかもっと早い3年とか
5年のスパンなのか分かりませんが
そういうところでこういうことが起こるんじゃないかな
っていうことについて2人で会話していきました
ありがとうございました
ありがとうございました
