Commentary

簡評二十一

A Brief History of CSS-in-JS: How We Got Here and Where We’re Going

以前D人decouple webpage做html, css 同javascript，點解D人又要merge返埋三樣野？
主要係因為生態嘅改變，以前嘅web只係document，但係易家個web越黎越流行web app，用component為單位。
Separation of conern 嘅改變做就左CSS in JS.

以下無需重讀

Fresh Work: 80/15/5

  • 80% of your time goes to low-risk/reasonable-reward work
  • 15% of your time goes to related high-risk/high-reward work
  • 5% of your time goes to satisfying your own curiosity

當新人可以take over你80%嘅 low risk work，咁之前投資嘅15% high risk work就會變成你易家嘅80%
而最尾果5%(2 hours per week)，有低機會變成你下一份80%，或者俾到你一個全新嘅方向

大公司里怎样开发和部署前端代码？

  • No cache -> 304 server side cache -> local cache
  • Client don’t know whether assets updated, as it use local cache and do not communicate with server
    • add query parmeter after assets’ path (?v=1.0.0)
  • 有時有D file內容冇變，將version換做content hash
  • 當有用CDN時，
    • update page先：如果有user係deploy期間訪問，始終會cache左舊嘅file
    • update asset先：冇cache嘅user係舊page攞左新assets
    • Solution係將hash加入file path，同時host新舊version嘅assets，但係記住要update assets先

Using a logbook to improve your programming

Log低每一個做左嘅task，之後可以review

  1. Consider the problem you’re attempting to solve
  2. Describe your method for solving it
  3. Describe the process of carrying out the method
  4. Record what happened, and ask how it could be improved
    入邊提到一本叫How to solve it嘅書係有CS版，有時間揾黎睇下

別被自己的 CDN 背叛：來用 Subresource Integrity

Subresource Integrity 提供browser一個verify 由第三方提供嘅javascript認證功能。如果個file係傳輸過程俾人惡意修改，透過checksum可以發現。

但係要用E個feature，有好多野要先準備好。

  • Inegrity check fail之後嘅fallback scripts
  • 係CI/CD flow calculate file嘅checksum
  • 係HTML上面嘅hash要update，仲有CDN cache嘅野要handle

How to Write an Engineering Blog

講一間公司應該係佢地嘅engineering blog寫D咩

  • Separate the engineering blog from product blog
  • Development嘅時候已經要諗定有咩可以share
  • Minimize writing time
    • Not require proofread before publish
    • Can write other’s idea, especially they don’t gave time to write about it
    • Use free Flicker image to illustrate the post
  • Write with a narrow focus on a topic of wide interest
  • Use keyword-rich titles

13 Jan 2019

My summary is good enough

Improving Scroll Performance with Passive Event Listeners

  • Scroll jank: Laggy scroll
  • Browser don’t know whether event handlers will cancel scrolls, so it always wait the handler finish before scroll, causing scroll jank
  • Passive event listeners means the handlers will not cancel scrolls, so browser does not wait the handler finish

What is the difference between “$@” and “$*” in Bash?

bash script入邊嘅$@係’array’ of argument，而$*就係成條嘅argument string