News
Meetup
YouTube
Blog
書き起こし
2021/07/02 に公開
1165 views
このエピソードについて
@potato4d が @kazushikonosu に、LINE バイトに snowpack を導入した経緯と効果について聞いてみました。
ゲスト紹介
@kazushikonosu
2021年新卒
UIT Front-End Dev9 チームフロントエンドエンジニア
内定者バイト時代からLINEバイトの開発を担当
snowpack とは?
ES Module ネイティブなバンドルしないビルドツール
webpack などと比較し、バンドルせずにブラウザ自体の module 機能を利用する
高速なビルド体験
HTTP/2 を存分に活用できる
LINEバイトにおける課題感
React + TypeScript で webpack でバンドルしている環境
SSR&SPA であり、 Next.js は不採用
webpack のバンドル設定に課題感があり、ビルドが遅くなっていた
ビルドに 20 秒ほどかかってかなり重い状態
差分ビルドがうまくいかない部分もあった
開発効率が著しく低下しているため、解決方法を模索していた
最終的に snowpack を導入するに至った
webpack を改善する手段もある一方、snowpack を採用するとさらなる高速化が期待できる
Vite なども検討したが、 React との親和性がより高いものが当時 snowpack だった
snowpack の適用
現在は開発環境のビルドに限定して snowpack を利用している
Production に対して適用するコードは、引き続き webpack により生成
結果
20sのビルド時間が20msに
Refs
LINE 新卒採用 2022
https://linecorp.com/ja/career/newgrads/engineering/
キャリア採用はこちらから
https://linecorp.com/ja/career/position/475
BGM&SE
魔王魂/騒音のない世界/OtoLogic
1.0x
1.3x
1.5x