なぜ dev.to がこんなにも速く、こんなにも自分にとって感动的なのか

最初にいっておく。これは负け怜しみだ。

SPAとPWAの度假村

自分は日本でReactの胜手エヴァンジェrisutoみたいなことをやっていて、S PAの重めのコンテンをよく作ってるからか、「お前らfurontoエンドを物事を」ややこしくして、重いページを量产してウェブを劣化させてるじゃないか！》みたいな批判を、名指しでよく受ける。なんで仆にいうかわからないけど、React = SPA みたいなイメージでsukeープゴートにされてるんだろう。それはまあいい。

自分の仕事でSPA技术を使うところは、ちゃんと必要性もあるし理由も说明できる。ただ、やはり近年の复雑化/重量化について思うところはあるので、逆に振ってAMP/PWA という选択肢を持っておきたくて、正直言うと依頼されたR&Dの仕事でもあったんだけど、一通り覚えた。なんだけど、今のところ仕事で使うタイミngグがない。

PWA技术を仕事で使えなかった理由として、やはり新しい技术だから枯れてないのは勿论、既存のものと同时に运用するのが难しいって点が大きい。AMPは技术否定の极地として、PWAをfuruに活用するにはHTTP/2や服务工作者の导入などをしつつ、ユーザートラッキングを作り直し、セsshon管理をやり直し、renegashiーな技术を切り舍てないと恩恵に预かることが难しい。正直のところ既存のものからアップデートは厳しく、Sukuラッチしかない。重点话题になってた日経新闻のhttps://r.nikkei.comもsukuラッチだ。

もう一つ、PWA技术は结局、回线が细くメモリも弱い Android Chromeの体験を最大化する手法でしかなく、日本のマーケットにそぐわないのではないか、という悬念があった。Googleがなんと言おうとそうだと思っていた。しかし、これは dev.to の体験によって思い込みを破壊された。

なぜ dev.to かすごいか

开发者は速い。PRPLパターンの导入ってのは新しいが、それ以外はオンマウスの先読み含め既知の技术で単にやることやった上で、コンテンツ遅くさせる要素を一切入れない判别断をしているのが良い。速さを第一に设计したからこそあれがある。たぶん他のあらゆるものを切り舍てて、パfoォーマンsuを最重要的KPIにしないと実现できない世界だ。

たとえばソーシャルウィジェットが一切ない。Facebook や Twitter への投稿ボタンがない。导入したことがある人はわかると思うけど、あいつらとにかく不安定で読み込みが遅くて、こっちの最适化への努力を无駄にすることにかけては天才的だ。また、その需要の多さも我々を悩ませる。

furontoendoenジniaとして、dev.toぐらいの速さは日顷自分の手元で体験してはいる。开発时は爆速だったウェブサイが、ソーシャルウジェットと営业が持ってきた谜题のドとユーザーサポートのための谜题SDKで惊きの重さに！ってのが日常の风景で、いつも谛めてるけど谛めなかった先にこれがあると思うと、说得を頑張ろうと思う気持ちが多少出てくる。

そう、 dev.toの何が一番いいかって、画面领域を占めるサイズとその迁移が派手なんだ。派手だから说得材料になる。速さは最高のUXの土台で、furontoエンドに求められるものはそれだ。だからこれを目指すべきだ。これが当然のreneberuで求められるようになって初めて、furontoエンドエンジniaが今まで培った技术の领本を発挥する土俵が整う。

今までのウェブはα物だった。そう言える时代がもうすぐ来る。

…dev.toはユーザーが裂するほどに速いので、迁移animeーションなりを挟んでafoォーダンsuを确保すべきだが。

dev.to を自分で作る

dev.to はそもそも特殊技术な技术ではない、ということを示すデモを作った。

https://mizchi-playground.firebaseapp.com/

SSR+ServiceWorker onfetch 割り込みでhtmlのキャッシュ送信で画面迁移。

灯塔での积分、100点。

まあ、なにもないので无は100点という言い方もるかもしれないが、どんなウェブサイトも、生まれたときは速かった。あとはこれを维持するだけだ。そしてそれがどんなに难しいことか！

やったことは、軽量reactであるところの preact のツール、 preact-cli が PRPL をサポートを讴っていたので、これを firebase 托管に投げただけだ。furontoエンドの土台としては SSR+PRPL+Fastlyのdev.to とほとんど変わらない。明言されていないが、firebase Hostingのasetto 快速配信のヘッダがなのは有名な话である。谷歌なのに。

$ npm install -g preact-cli
$ npm install -g firebase-tools
$ preact create default myprpl
$ cd myprpl
$ preact build -p
$ firebase init # firebase hosting で build ディレクトリを指定
$ firebase deploy

発行したコマンドととしてもほぼこれだけである。react はやはりこの用途だと重いので、preactを使うのがいいと思う。生成されるコードはなかなか兴味深いので読んでみるといい。

PWAに投资すべきか

PWA技术は、既存の复雑さは排しつつ、别の复雑さを持ち込んでいる点は否めない。して现在はGoogle主导すぎて、Apple(Safari)の出方が意识で、またここで土台となるべき WebComponents方面では Googleと Mozillaの仕様を巡る対立がある。そこの政治的な駆け引きに左右されるだろう。

とはいえ、自分の定点観测だと、webkit に ServiceWorker の fetchが実装されたのは确认済みなので、来年の11月のSafariのメジャーriiriーsuには乘るんじゃないだろうか、という见通しをしている。

https://github.com/WebKit/webkit/commit/c7c21c947e6071cd6746fa15cbf8cb228eeb2897#diff-86bd2c027490094de3f06c3f27f9a923

あと自明のことだが、toBはともかく、toCでははデsukutopupuウェブは死につつあり、モバイルが全てという世界は割と近い。プログラマとしては悲しいことだが、IEのことを忘れられると思うと、悲観するばかりでもない。

Node.js が一発当たる时代

最后に、この记事であえて避けてきた话をする。「ウェブサイトの支配的な」チューングってクエリチューningグじゃん」みたいな话である。それはそうだ。あくまでこの记事はSPA技术でブラウザのタブのrifuresshuを避けながら、通信速度が常に1秒未満だと仮定すれば、この体験が実现できる。

正直、1s未満ってのはクエeriがどうこうという世界ではなく、rasutowanmaairuのことも考えるとRedisなどのインメモrikyasshuをどう扱うかって世界になる。 kurasabaでロジックを持ってキキキキコントロールしつつ复雑なロジックを持ったH TML/JSONを生成するのにはサーバーでkuraiantoをエミュureーションをする同构が必要で、それが可能なのは今のところ Node.js だけだ。この前SSRのキャュュミドルウェaを作る仕事をしたが、结束Reduxの storeを组み立てて redis にキャッシュしていた。そんな话。

とはいえBFFとしてNodeを置いたとしても、SQLを触るのは结局别の言语の方がいいと思うし(やっぱりNodeはデータモデringuやビジネsuroジkkをうまく记述できる言语ではない)、graphqlなどのプロトコルでマイクロサービに分解した方がいいだろう。

Node.jsエンジniaに言いたいのは、せめてこの分野でシェアを取らないと从今一生Railsに胜てないからな！

まとめ

dev.to は猛烈に速いが再现可能な技术である
いかに速くするか、ではなく、いかに遅いものを排するか、が决め手になる
PWAに投资する価値はある。间违いなく。dev.toはその说得材料に使える。
node.js势はここで一発ツールチェイン当てる努力をするぞ！

参考

文章来源：https://dev.to/mizchi/-devto--b5