前端 JS 如何避免 callback 地獄？Fetch API 及 Promie 使用技巧
由於早期 Javascript 設計上的缺陷，一方面使用 Ajax 送出 http 請求時，舊時代的 API 異常繁複，非得使用 JS 框架操作 Ajax 才比較方便，例如 jQuery。 一方面 Ajax 是非同步(Asynchronous)執行緒，會造成前端工作一些麻煩，例...
繼續閱讀全文2020 Lazy Load 延遲載入圖片原理及實作分析研究
前陣子接到一個需求，客戶網站做完「PageSpeed Insights」檢測後分數很低，於是尋求協助。對客戶網站進行健檢後提供一份報告與建議，客戶詢問「延遲載入畫面外圖片」的部分如何改善。 這個項目「PageSpeed Insights」本身提供了不少參考資料，不過研究後才發...
繼續閱讀全文使用跨域代理伺服器(CORS PROXY)，解決讀取第三方網站資料問題﹍實作範例
前端開發人員寫 JS 遇到需要串接第三方 API，或是想存取第三方網站的資料時，遲早會遇到跨域限制的問題。 跨域(Cross-Origin Resource Sharing)的原理可參考這篇「 跨來源資源共用 」，因為安全性考量，網站主幾可設定收到 HTTP 請求時，是否允許...
繼續閱讀全文讓圖片有放大鏡效果的 jQuery 外掛, 支援手機版﹍mlens
最近接到的需求是，希望滑鼠經過圖片時，能像使用放大鏡一樣，掃過的區域有放大的效果。 類似的功能還滿常見的，例如購物網站，需要展示產品的頁面，由於網頁的空間、寬度有限，圖片很難呈現局部細節。為了降低消費者的疑慮，有必要用放大鏡功能，讓小圖來呈現大圖的細部效果。 另外客戶也希...
繼續閱讀全文網頁資料存成 CSV 需要解決的問題整理﹍亂碼 + JS 技巧 + Bootstrap 表格
最近客戶需要在網頁上顯示大量的會員資料後，製作一個「匯出」按鈕，將表格所有資料匯出存成 CSV 檔，再用 EXCEL 之類的試算表軟體開啟。 整個流程要用的的技術其實沒有太高深，但是陷阱卻是很多，因此整理成一篇備存。 (圖片出處: pexels.com )
繼續閱讀全文
