博客 / 列表

Shenfq - 前端模塊化的前世

隨着前端項目的越來越龐大,組件化的前端框架,前端路由等技術的發展,模塊化已經成為現代前端工程師的一項必備技能。無論是什麼語言一旦發展到一定地步,其工程化能力和可維護性勢必得到相應的發展。 模塊化這件事,無論在哪個編程領域都是相當常見的事情,模塊化存在的意義就是為了增加可複用性,以儘可能少的代碼是實現個性化的需求。同為前端三劍客之一的 CSS 早在 2.1 的版本就提出了 @import 來實現模塊

前端模塊化 , seajs , commonjs , requirejs , Javascript

Shenfq - React 中 setState 是一個宏任務還是微任務?

最近有個朋友面試,面試官問了個奇葩的問題,也就是我寫在標題上的這個問題。 能問出這個問題,面試官應該對 React 不是很瞭解,也是可能是看到面試者簡歷裏面有寫過自己熟悉 React,面試官想通過這個問題來判斷面試者是不是真的熟悉 React 🤣。 面試官的問法是否正確? 面試官的問題是,setState 是一個宏任務還是微任務,那麼在他的認知裏,setState 肯定是一個異步操作。為了判斷

react , promise , settimeout , 前端 , Javascript

Shenfq - 在命令行裏也能用 React

用過 React 的同學都知道,React 作為一個視圖庫,在進行 Web 開發的時候需要安裝兩個模塊。 npm install react --save npm install react-dom --save react 模塊主要提供了組件的生命週期、虛擬 DOM Diff、Hooks 等能力,以及將 JSX 轉換為虛擬 DOM 的 h 方法。而 react-dom 主要對外暴露一個 rend

react , terminal , 前端 , Javascript

Shenfq - JavaScript 異步編程史

前言 早期的 Web 應用中,與後台進行交互時,需要進行 form 表單的提交,然後在頁面刷新後給用户反饋結果。在頁面刷新過程中,後台會重新返回一段 HTML 代碼,這段 HTML 中的大部分內容與之前頁面基本相同,這勢必造成了流量的浪費,而且一來一回也延長了頁面的響應時間,總是會讓人覺得 Web 應用的體驗感比不上客户端應用。 2004 年,AJAX 即“Asynchronous JavaScr

promise , async-await , generator , 前端 , Javascript

Shenfq - 下一代的模板引擎:lit-html

前面的文章介紹了 Web Components 的基本用法,今天來看看基於這個原生技術,Google 二次封存的框架 lit-html。 其實早在 Google 提出 Web Components 的時候,就在此基礎上發佈了 Polymer 框架。只是這個框架一直雷聲大雨點小,內部似乎也對這個項目不太滿意,然後他們團隊又開發了兩個更加現代化的框架(或者説是庫?): lit-html、lit-ele

模板引擎 , webcomponents , HTML , 前端