WIC Speed Hackathon Online
- webpack-mergeをinstallするとdev用とprod用などでconfigを分けられる
- とりあえずmoment -> dayjs
- jqueryを置き換えたいけど、bodyにどうこうしたい時React的には何が正しいお作法なんだろうか
FB.XFBML: parse()を呼んでその場で(クライアントサイドで)XFBMLを描画できる。XFMBLがなんなのか調べてもあまりよくわからなかったけどFB特化の何かなんだろうな: 参考, 参考- globalThisを使うとwindow/non-wimndowの環境に関わらず一貫した方法でグローバルオブジェクトにアクセスできる。
remove()の役割がよくわからんな…実行されても要素消えてない気がする。- lodash -> lodash-es
あとは
- そのほかモジュールのtreeshake化
- webpackのproduction mode (optimization config)
- 画像をwebpにする
- 画像をデバイスで出しわける
- キャッシュ
- 画像のサイズ最適化
- brotli使うとか
- ホストサーバーの場所など
- CDN噛ませる
- モジュールのlazyload など？
https://www.kabuku.co.jp/developers/tree-shaking-in-2018
- おさらい的に。
- CommonJSではrequireやexportsを動的に書くことが可能(例えば参考演算子使ったり)なので、静的に解析するtree shakeは難しい
- ESModuleでも必ずtreeshakeできるとは限らない。副作用のある関数(importされる/されないに限らず何かが実行される関数など)を削除してしまうと挙動が変わるため。そのため、副作用のない関数のリストを渡したり副作用がないことを明示したりする必要がある。
