原创 富文本編輯器 quill.js 開發(一): 自定義工具欄
前言 在前端開發中, 富文本是一種常見的業務場景, 而本文要講的就是富文本框架 quill.js 中的自定義工具欄的開發 介紹 Quill.js 是一個具有跨平臺和跨瀏覽器支持的富文本編輯器。憑藉其可擴展架構和富有表現力的 API，可以完
2022-09-30 13:01:24
原创 寫給前端的 react-native 入門指南
前言 本文主要介紹 react-native(下稱 RN) 的入門, 和前端的異同點 文章不涉及功能的具體實現 選擇優勢 我們先說說, 爲什麼很多人會選擇使用 RN 、他對應的特性和普通 Web 的區別 前端資源, 生態的互通 因爲
2022-09-01 13:01:47
原创 bun.js一個新的JavaScript運行環境
介紹 Bun 是一個現代的JavaScript運行環境，如Node, Deno。主要特性如下: 啓動速度快。 更高的性能。 完整的工具（打包器、轉碼器、包管理）。 下面我們來橫向對比下框架所說的性能: 相同電腦下, 不同 js 運行環境
2022-07-30 13:02:07
原创 bun.js 一個新的JavaScript運行環境
介紹 Bun 是一個現代的JavaScript運行環境，如Node, Deno。主要特性如下: 啓動速度快。 更高的性能。 完整的工具（打包器、轉碼器、包管理）。 下面我們來橫向對比下框架所說的性能: 相同電腦下, 不同 js 運行環境
2022-07-30 13:01:57
原创 bun.js 一個新的JavaScript運行環境
介紹 Bun 是一個現代的JavaScript運行環境，如Node, Deno。主要特性如下: 啓動速度快。 更高的性能。 完整的工具（打包器、轉碼器、包管理）。 下面我們來橫向對比下框架所說的性能: 相同電腦下, 不同 js 運行環境
2022-07-30 13:01:57
原创 node_modules 瘦身
起因 場景一: 當前項目經歷了刀耕火種地開發, 之後接入了 cli 工具集中管理打包, 那麼項目中的依賴, 和 cli 工具中的依賴重合度是多少, 並且他的的版本是否相同, 是否有冗餘代碼 場景二: 項目中某一個庫升級了, 他依賴了 A 庫
2022-06-28 13:01:34
原创 CSS 自定義屬性指北
前言 在現代瀏覽器中, 我們會經常看到這樣的屬性: element { --main-bg-color: brown; } 這裏我們就來介紹一下他, 並提供一些相關的說明 簡介 自定義屬性（有時候也被稱作CSS變量或者級聯變量）是由
2022-05-10 13:01:25
原创 react-router v3 升級至 v6 探索小結
背景 在當前業務項目中使用的 react-router 版本爲 3.x, 而當前主流使用的是 5.x 以上, 本文就來探究 react-router 升級的方案 當前情況 目前使用的是 react-router3.x 版本 再加上和 red
2022-04-14 13:01:25
1
原创 前端多數據渲染優化
前言 在前一段時間做一個需求的時候, 碰到一個自定義列表的功能, 他的所有數據顯示都是通過 jSON 字符串來存儲,使用也是通過 JSON 解析 起先他是有數據上限的, 但是後面提高上限後就出現了卡頓等問題, 所以本文就是介紹一些方案來解決
2022-04-01 13:01:36
原创 react-window 源碼淺析
react-window 這篇是 react-window 的源碼閱讀, 因爲此庫使用的是 flow, 所以會涉及一些特殊的東西, 和 ts 類似 使用 List 首先是 List 的使用: import {FixedSizeList as
2022-03-01 13:01:31
1
原创 react-virtual 源碼閱讀
前言: 這次本來想解析 react-virtualized 的源碼, 但是他的內容太多, 太雜, 我們先從小的庫入手, 由點及面 所以這次改爲了 react-virtual 和 react-window 的源碼, 這篇就是 react-v
2022-02-09 13:01:29
4
原创 react-router 源碼閱讀
這次的版本是 6.2.1 使用 相比較 5.x 版本, 元素升級爲了 簡單的 v6 例子: function App(){ return <BrowserRouter> <Routes>
2022-02-01 13:01:23
原创 react-router-dom 源碼閱讀
這次的版本是 6.0.2 這裏只講 react-router-dom 提供的 API, 像是 Routes, Router 這些都是 react-router 提供的 源碼閱讀 BrowserRouter, HashRouter Bro
2021-12-24 13:49:00
原创 關於 ArrayBuffer
ArrayBuffer 是什麼 ArrayBuffer 對象用來表示通用的、固定長度的原始二進制數據緩衝區。 它是一個字節數組，通常在其他語言中稱爲“byte array”。 你不能直接操作 ArrayBuffer 的內容，而是要通過類
2021-11-30 13:48:58
1
原创 react-loadable 源碼解析
react-loadable 源碼解析 簡要的來說, loadable 是一個高階函數, 他同時利用了 react 的渲染 API, webpack 知識點, babel, promise 合併起來的組件 使用 首先我們要知道 react
2021-11-01 13:49:09