Instantly share code, notes, and snippets.
Save azu/eec4f71348c3e8bb63176df8b78f6b01 to your computer and use it in GitHub Desktop.
ツールチェインのベストプラクティス
人による
参考:
- 「フロントエンド開発入門」出版のお知らせ. 10/9 に本を出版させていただくことになりました。 | by Satoshi Takeda | Medium
- The Front-End Tooling Survey 2019 - Results - AshleyNolan.co.uk - Blog and Portfolio for Ashley Watson-Nolan (地域の偏りが出る)
Babelが何をやってるか
TypeScriptと同じレイヤー: (未来の可能性を含む構文の)JavaScript to (サポートしたい対象で動く構文の)JavaScriptをする
プラグインでなんでもできるので、なんでもできる変換レイヤーとして使われることがある。Tool for Tool.
transpiler, polyfill, shim 違い
ユニットテスト
プログラム一般的な話になりそう。
cc @t_wada
CSS
人による
参考:The State of CSS 2020 (地域の偏りが出る)
パフォーマンス最適化
パフォーマンス最適化は人類には早いため、何が最適化を妨げる(deoptimize)のかを意識した方が気持ちが楽。VSCodeにImport Costを入れたり、ライブラリを選ぶ時にBundlephobiaにとりあえず入れる癖をつけるとかがコスパが良さそう。
傾向として余計なものが多い = パフォーマンス悪くなる。
JavaScriptのレイヤーでは早いコードはあんまり意識しないほうが良い。DOM APIのレイヤー(ReactやVueなど)はフレームワークに従いましょう。
巨大なデータを扱うときは別なので、一度に扱うデータを限定(表示領域のみ描画とかStream処理)するとかは考えましょう。(フロントだと大体固まるだけで終わるので、サーバの方がクリティカルになりやすい)
最適化の方法は必要になったら調べればいい(その時に最適なものを選ぶ)
Sign up for freeto join this conversation on GitHub. Already have an account?Sign in to comment