フロントエンドの話を学んでいると思ったらTLSハンドシェイクだったりExpiresとかのキャッシュ系ヘッダだったり「例えばGCを避ける」だったりCPUだったりなんかいろいろ学んでいる。あれ？
— k1LoW (@k1LoW) 2017年8月17日
- 作者: 久保田光則
- 出版社/メーカー: 技術評論社
- 発売日: 2017/05/26
- メディア: 単行本（ソフトカバー）
- この商品を含むブログを見る
私のフロントエンドスペック
まずは前提です。こういうスペックの人の感想ということでご了承ください。
- 主にPHPでWebアプリケーションを構築するエンジニア
- 業務でもHTML/CSSでデザインしてくれるWebデザイナとのやり取りが多く、「フロントエンドエンジニア」とお仕事をしたことは数えるくらいしかない
- サーバサイドのJavaScriptには最近興味あって触っている（サーバーレスとか）
つまりフロントエンド周辺については趣味プロレベルです。
感想
いやー、濃かった。一言で言うと「濃い」です。正直すべてを理解できたわけではないです。30%理解できていたら上出来です。
でも、読んで良かった！
個人的には
読むと読まないとではゼロイチで違う
そんな書籍でした。残り70%、またどこかで再読しようと思います。
仕組みを根拠としたチューニング
「ハイパフォーマンス」「チューニング」という単語があるように基本的には高速化の本です。
個人的には「ブラウザからサーバへリクエストを投げてからブラウザで次のページに遷移するまで」の仕組みを説明して「だから高速化になりうる」という形でチューニング方法を説明していて、どちらかというと「仕組み」のほうが勉強になりました。
フロントエンドエンジニアの人だったら逆なんでしょう。
むしろ、仕組みについてページをさいていたと思います。フロントエンドの基礎を学んだ感じがしました。
サーバサイドエンジニアにもWebデザイナにもフロントエンドのパフォーマンスのためにできることはある
少々乱暴な分類をします。すみません。
例えば、Webアプリケーションを「サーバサイドエンジニア」「フロントエンドエンジニア」「Webデザイナ」で構築するとします。
HTML/CSSは共通言語です。あとjQueryもいまや共通言語といえるかもしれません。
フロントエンドのパフォーマンス向上はフロントエンドエンジニアが一番得意でしょう。フロントエンドエンジニアに任せるのが一番だと思います。
ただ、だからといってサーバサイドエンジニアやWebデザイナから、何も考えず作られたHTML/CSS/JavaScriptを渡されてもパフォーマンス向上の余地は小さいと思います。
フロントエンドのパフォーマンス向上の余地をできるだけ広くするようにサーバサイドを構築したり、HTML/CSSを組んだりすることはできるはずです。
そういった意味で、サーバサイドエンジニアとして「フロントエンドの領域で○○に注意して構築することでパフォーマンス向上の余地を残しておく」という情報にインデックスを貼ることができる書籍でした。
そういえば思い出したのですが、昔、Webデザイナの方から「CakePHPのctp分離を完全に考慮したHTML/CSS」を渡されて、最高に効率よくデザイン適用と運用できた経験があります。最高にテンションがあがりました。
私もそういったバトンタッチができるようになりたいです。
章別感想
かんたんに章別の感想です。
1〜3章
自分の得意分野でない範囲の技術書、読み進めるのめちゃくちゃ遅い。
— k1LoW (@k1LoW) 2017年8月15日
本書を読むときにいろいろ前提となるので、まず読んでおいたほうが良い章です。3章の「計測」章は今すぐからでも使えますね。
ただ、まさかTCP/IPやTLSハンドシェイクの説明からはじまるとは。。。。
4章
俄然面白くなってきた！得意分野じゃなくてもいつも触っている守備範囲で知らなかったことを知る体験すると進む。技術書がススム君。
— k1LoW (@k1LoW) 2017年8月17日
個人的に俄然面白くなった章です。
理由は明らか。自分の守備範囲だから（しかも知らないことがあった）。defer属性とか使ったことなかったです。
「できることはいろいろある」というのを感じることができた章でした。
逆に言うとあまり気にしていなかったんだなーと。
4章は「あー知ってる、知ってる」となりたかった。。。
5章
JavaScriptの別の世界。
「console.log()はメモリリークする」なんて、フロントエンドの世界では常識なんですか？
この章から著者 id:anatooさんの以下の発表が追加章的につながっています（と思いました）。こちらもどうぞ。
JavaScriptを書くとき、ここまでしっかり考えたことなかったな。。。
6〜8章
ざっくりいうとDOMの世界のチューニング。
CSSをどう組むかについて、私は良くて「メンテナンサビリティ」、大抵は「うまく表示できるか」程度しか考えられていませんが、パフォーマンスという観点でCSSを組む世界。。。
「子孫セレクタ、間接セレクタは他のセレクタよりもオーバヘッドが大きい」というかそもそも間接セレクタを知らなかったりしました。
9章
「認知的チューニング」ということで体感速度についてチューニングの章。一般的な手法について丁寧に解説しています。
こういった処理は実装時からうまく入れられるようにしていきたいです。
フロントエンド領域を知ることができる書籍
例えば「SPA」がもてはやされるようになっているように、フロントエンドと呼ばれる領域はますます重要になってくるんだと思います。
自分はフロントエンドエンジニアには（おそらく）ならないとは思いますが、フロントエンドエンジニアと一緒にうまく開発ができるエンジニアにはなりたいです。
本書「Webフロントエンドハイパフォーマンスチューニング」は、Webアプリケーション開発に関わっているエンジニア/デザイナ「も」フロントエンドの情報にインデックスをはるために読んでおいたら良さそうな本だと思いました。
最後に
本書は Geeks Who Drink にて、著者の id:anatoo さんから頂きました！
ありがとうございました！
さて、計測してみよう。。。
