原创 聊聊 node 如何優雅地獲取 mac 系統版本

背景 今天突然碰到了一個兼容性需求,需要根據不同 macOS 版本,進行不同的兼容性處理。 沒想到看似簡單的需求,中間也經歷了一番波折,好在最後解決了問題。 在此記錄一下解決問題的過程,也方便其他有類似需求的同學參考。 獲取系統類型 既然需

原创 聊聊動效降級

前言 在日常開發中,經常會碰到包含有大量動效的需求。當一個頁面包含有大量動效時,經常會出現卡頓、性能不佳的問題。 正所謂開發三天,優化兩星期,爲了優化這些動效,很多同學只能一點點摳代碼,探尋加載時間點、渲染速度、資源體積等優化點的極限,前端

原创 淺談瀏覽器實時構建

前言 在遙遠的幾個月前,還在上家公司的時候,老闆突發奇想,想要搞個代碼片段平臺,類似於 snipit,實現代碼片段的複用。本身這個需求並不難實現——簡單的前端界面 + 簡單的 node CURD,搞定收工,下班回家。 但是,在實際使用中,發

原创 2020 總結 | 格子熊 - 日拱一卒,功不唐捐

引子 從 2017 年畢業算起,轉眼間已經過了三年,每年的這個時間,總是想寫點什麼,紀念一下過去的一年,然而每次寫了一半,總會因爲各種原因停下了筆(其實就是拖延症拖過期了~)。 但是,今年,魔幻的 2020 年,對我來說也是重要一年,非常值

原创 聊聊前端監控——錯誤監控篇

當有人問起:你們的公司的這款應用用戶體驗怎麼樣呀?訪問量怎麼樣?此時,你該怎麼回答呢?你會回答:UV、PV 巴拉巴拉,秒開率、FP、TTI 巴拉巴拉。 那麼,這些數據是哪裏來的呢?顯而易見,這些數據都來自前端監控系統。 前端監控的意義 當今

原创 從一次故障聊聊前端 UI 自動化測試

背景 事件的起因在於老闆最近的兩次“故障”,一次去年的,一次最近。共同原因都是腳手架在發佈平臺發佈打包時出錯,導致線上應用白屏不可用。 最神奇的是,事後多次 Code Review,結果還是沒有發現任何能夠導致該問題的 bug,最後推測有可

原创 聊聊 TypeScript 中的類型保護

聊聊 TypeScript 中的類型保護 在 TypeScript 中使用聯合類型時,往往會碰到這種尷尬的情況: interface Bird { // 獨有方法 fly(); // 共有方法 layEggs()

原创 聊聊 Vue 中 provide/inject 的應用

衆所周知,在組件式開發中,最大的痛點就在於組件之間的通信。在 Vue 中,Vue 提供了各種各樣的組件通信方式,從基礎的 props/$emit 到用於兄弟組件通信的 EventBus,再到用於全局數據管理的 Vuex。 在這麼多的組件通信

原创 聊聊 Vue 中 axios 的封裝

聊聊 Vue 中 axios 的封裝 axios 是 Vue 官方推薦的一個 HTTP 庫,用 axios 官方簡介來介紹它,就是: Axios 是一個基於 promise 的 HTTP 庫,可以用在瀏覽器和 node.js 中。 作爲

原创 ElementUI 源碼簡析——源碼結構篇

ElementUI 作爲當前運用的最廣的 Vue PC 端組件庫,很多 Vue 組件庫的架構都是參照 ElementUI 做的。作爲一個有夢想的前端(鹹魚),當然需要好好學習一番這套比較成熟的架構。 目錄結構解析 首先,我們先來看看 Ele

原创 ElementUI 源碼簡析——Basic篇

Layout 佈局 row 佈局組件中的父組件,用於控制子組件。很簡單的一個佈局標籤,主要通過 justify 和 align 控制子元素的對齊方式,使用 render 函數通過傳入的 tag 屬性控制生成的標籤。 在這裏推薦學習下 ren

原创 聊聊 Vue 中 title 的動態修改

由於之前的 Vue 項目打包成果物一直是嵌入集成平臺中,所以一直沒有關注過項目的 title。直到最近,突然有個需求,要求點擊按鈕在集成平臺外新開一個頁面,此時我才發現,原來我的項目的 title 一直是萬年不變的 vue-project。

原创 Chrome 性能監測

前端性能優化一直是前端工作中必不可少的一部分,但是我們如何知道哪些部分的性能有優化的空間呢?此時,Chrome 性能監測就派上用場了。 正所謂:知己知彼,百戰百勝,只有確定了性能瓶頸,纔能有條不紊地進行前端性能優化工作。 Performan

原创 console 調試技巧

前言 如果統計一番前端最常用的方法,那麼 console.log 一定位列其中。無論你寫的是原生 JS 亦或者是 JQuery、Vue等等,調試之時,都離不開 console.log 方法。但是,console 對象中的方法不僅僅只有 lo

原创 [譯]重新思考單元測試斷言

原文地址:https://medium.com/javascript-scene/rethinking-unit-test-assertions-55f59358253f 作者:Eric Elliott 「斷言」是編程術語,表示爲一些