改善網站效能：將 icon 轉為 font 字型
現代網站設計中充滿了各式各樣的 icon，若是自有品牌或產品，設計師更常會為了強化視覺一致性而客製一整套的 icon 圖示。
而從我們工程師的角度來看，icon 本質上就是一種圖片，既然是圖片的一種形式，當 icon 使用量一多，自然就會牽涉到與圖片相同的效能問題。為什麼 icon 太多會影響效能？
為什麼 icon 太多會影響效能？
通常 icon 是以圖片檔案（例如： SVG
CSS
用 HTML br 替換 ↵ 換行前先想一想
這篇算是一個隨手紀錄，不要輕易用 <br/> 替換換行 ↵，先想想有沒有其他的方式。
起因
前陣子在處理前人的 Legacy code，有個情境是使用者在後台頁面輸入文章，前端把其 show 在前台頁面上。
當然後端會在需顯示的前台頁面 API 將其(字串)發過來，這個字串不包含 HTML 標籤，可能包含換行符號，為了處理這個狀況，
React v14 和 v16 Style 行內樣式的雷
昨天在公司遇到 React Style 行內樣式的雷，害我 dubug 了老半天。
是這樣的我們公司有兩個 B2C 的網站平台長得很像，差異只在顏色與風格不同，一個網站前端是 React v14，另一個相對新是用 React v16，而兩個網站很多功能都要一樣，所以一個前端元件寫好後要想辦法讓 React 的 14 版和 16 版共用，
IE 議題
前陣子與到各種 IE 問題真的有夠痛苦，實在不理解為什麼都 2019 年了還要支援到 IE9？IE11 就算了，IE9 欸？？IE 有多少使用量不就 GA 報表一看就知道了嗎？
主事 PM 不理解 RD 處理 IE 9 的時間都能做其他新功能了，哀抱怨歸抱怨，這裡紀錄一下遇到的問題：
解決 CSS 困境的 scoped style
在使用Vue Cli開發時，Vue是將每個組件(副檔名.vue)拆封成HTML、CSS、JavaScript三個部分，也就是如下：
<template>
//這裡寫HTML
</template>
<script>
//這裡寫JavaScript
</script>
<style&