tag react

標籤
貢獻252
299
05:50 PM · Oct 25 ,2025

@react / 博客 RSS 訂閱

Grewer - React 性能 debug 小記

前言 之前開發重構項目的時候,遇到了一些問題, 如 hooks 的性能問題和 quill 的重載問題。本文就是記錄這些問題的解決過程。 場景 在基於富文本的輸入場景中,我們發現在輸入回車後會出現明顯的卡頓現象。為了更好地展示此類場景,這裏使用了一個簡單的例子展示。 function App() { const [value, setValue] = useState(''); /

performance , react , 性能分析 , 前端 , Javascript

收藏 評論

rxliuli - 使用 React Hooks 結合 EventEmitter

使用 React Hooks 結合 EventEmitter 吾輩的 blog 原文在: https://blog.rxliuli.com/p/43...,歡迎來玩! 場景 EventEmitter 很適合在不修改組件狀態結構的情況下進行組件通信,然而它的生命週期不受 react 管理,需要手動添加/清理監聽事件很麻煩。而且,如果一個 EventEmitter 沒有使用就被初始化也會有點麻煩。 目

react , hooks , event

收藏 評論

程序員老葉 - 什麼是 CRM 銷售管理系統?一文解讀:功能、作用、主流廠商

在數字化轉型的浪潮中,企業對客户關係管理的需求日益增長。CRM(Customer Relationship Management)銷售管理系統已經成為現代企業提升銷售效率、優化客户體驗的核心工具。本文將深入解讀CRM系統的本質、核心功能、實際作用,並介紹包括Zoho CRM在內的主流廠商,幫助您全面瞭解這一重要的企業管理工具。 一、CRM銷售管理系統的本質 CRM銷售管理系統是一種集成化的軟件解決

react , antd , 知識

收藏 評論

浪遏飛舟 - create-react-app腳手架搭建chrome插件項目

背景 上篇文章《前端項目本地調試方案》中講到開發chrome拓展插件幫助完成Cookie複製,從而實現本地項目調試。但插件採用的是原生JS開發,本文來探討如何使用creact-react-app搭建chrome插件應用? 項目實踐 初始化目錄結構 首先,執行下面命令初始化項目 create-react-app chrome-extension --template typescript 創建的項目

react , 谷歌瀏覽器插件 , chrome-extension , 谷歌擴展 , create-react-app

收藏 評論

數據庫知識分享者 - OpenKruise v0.8.0 核心能力解讀:管理 Sidecar 容器的利器

簡介: OpenKruise 是阿里雲開源的雲原生應用自動化管理套件,也是當前託管在 Cloud Native Computing Foundation (CNCF) 下的 Sandbox 項目。它來自阿里巴巴多年來容器化、雲原生的技術沉澱,是阿里內部生產環境大規模應用的基於 Kubernetes 之上的標準擴展組件,也是緊貼上游社區標準、適應互聯網規模化場景的技術理念與最佳實踐。 前言 Ope

react , coffeescript , bootstrap , Javascript

收藏 評論

hiisea - 微模塊-前端業務模塊化探索,拆解巨石應用的又一利器

大家好,我是Eluxjs的作者,Eluxjs是一套基於“微模塊”和“模型驅動”的跨平台、跨框架『同構方案』,歡迎瞭解... 文前聲明,以下推斷和結論純屬個人探索,鑑於本人知識水平所限,謬誤在所難免,懇請各位大佬不吝賜教... 什麼是前端“微模塊”? Elux中的『微模塊』是指在Web前端工程中,將代碼和相關資源按照不同的業務功能進行歸類和模塊化。 根據業務功能進行模塊化一直以來都是後端的普遍做法,

react , vue.js , 前端工程化 , 前端架構 , 前端框架

收藏 評論

hiisea - 前端架構-分層而治,鐵打的MV流水的C

為什麼在web前端很少有人會提到分層架構,例如經典MVC架構,這是因為瀏覽器誕生之初就只是作為一個後端數據的GUI渲染器。也就是説整體來看,web1.0時代的整個web前端工程就是一個View層,而Model和Controller就是指後端,所以根本無需在web前端工程中去提什麼MVC。 然而web生態發展到今天,瀏覽器越來越強大,賦能越來越多,甚至不亞於一個小型操作系統,這時候的Web前端早已不

react , vue.js , 前端工程化 , 前端架構 , 前端框架

收藏 評論

hachimei - 初學React高階函數

React和高階函數的定義就不説了,主要是記錄下小白看react庫時大佬用高階組件時看不懂的地方。 export const createCesiumComponent = E, P, C, CC = {}, R = {}( opts: CesiumComponentOptionE, P, C, CC, R, ): CesiumComponentTypeE, P, C = { class

react , currying , hoc

收藏 評論

joyerli - react跨組件狀態流:用事件流實現一個極其輕量高效的狀態流工具

如果你也喜歡使用react的函數組件,並喜歡使用react原生的hook進行狀態管理,但為了跨組件狀態流而不得不引入redux,MboX這種具有自己獨立的狀態管理的重量級/對象級的狀態流框架的話,本文會給你提供一種新的極其輕量的解決跨組件狀態流方案。 Context的問題 首先探討如果不採用redux,mobx,使用原生的react的跨組件共享狀態方案Context,會具備那些問題? react原

react , react-hooks , react-state-management , react-state

收藏 評論

Jhey Tompkins - A Guide To Audio Visualization With JavaScript And GSAP (Part 2)

Last week in Part 1, I explained how the idea about how to record audio input from users and then moved on to the visualization. After all, without any visualization, any type of audio recording UI

react , Techniques , coding , Javascript

收藏 評論

長林啊 - 掌握 React Router:構建你的 React 應用導航

大家好,我是長林啊!一個 Go、Rust 愛好者,同時也是一名全棧開發者;致力於終生學習和技術分享。 本文首發於微信公眾號《全棧修煉之旅》,歡迎大家關注! 在構建現代 Web 應用時,導航是連接用户界面的關鍵紐帶。React Router 作為 React 生態中的核心路由庫,為開發者提供了強大的工具來實現 SPA(單頁應用)的導航邏輯。它不僅簡化了頁面間的跳轉,還支持動態路由匹配、懶加載和狀態管

框架學習 , react , 單頁應用 , web開發 , 前端

收藏 評論

Banshee - react在哪個生命週期調用定時器,何時銷燬?

之前的文章中,簡單介紹過vue生命週期裏面清除定時器的生命週期,今天看了react官方文檔,上面説componentDidMount()方法會在組件已經被渲染到 DOM 中後運行,所以最好在這裏設置計時器: componentDidMount() { timer = setInterval(() = { this.setState(() = ({

鈎子 , react

收藏 評論

追風的苦咖啡 - 國密SSL證書的三大核心優勢:自主可控、合規性與高性能

國密SSL證書作為國產密碼技術的重要應用,其核心優勢體現在以下三個方面: 國密SSL證書⬇️ https://www.joyssl.com/certificate/select/national_secret_alg... 一、自主可控:打破技術依賴,保障安全主權 全流程自主化:國密SSL證書採用我國自主研發的SM2/SM3/SM4算法體系,從加密算法到證書籤發均實現國產化,避免因使用國外技

觀點 , react , css3 , 知識 , Javascript

收藏 評論

Juan Diego Rodríguez - Gatsby Headaches: Working With Media (Part 1)

Working with media files in Gatsby might not be as straightforward as expected. I remember starting my first Gatsby project. After consulting Gatsby’s documentation, I discovered I needed to use the

performance , react , optimization

收藏 評論

Melvin Kosisochukwu - Optimizing Next.js Applications With Nx

In this article, we will go through how to optimize and build a high-performance Next.js application using Nx and its rich features. We will go through how to set up an Nx server, how to add a plugi

react , Tools , Apps , typescript , Javascript

收藏 評論

破曉L - 現代 JavaScript 框架工作原理你瞭解多少?

讓我們通過構建一個現代 JavaScript 框架來了解其工作原理。 我的日常工作是開發 JavaScript 框架 (LWC)。雖然我已經在這個框架上工作了近三年,但我仍然覺得自己是個門外漢。當我閲讀大型框架領域的最新動態時,我常常會被自己不知道的事情壓得喘不過氣來。 不過,瞭解某些東西如何工作的最好方法之一就是自己動手創建。另外,我們還得讓那些 “days since last JavaScr

react , vue.js , 響應式 , 前端 , Javascript

收藏 評論

數據庫知識分享者 - 阿里雲科技驅動“數字化轉型”,助力中小企業發展“突圍”

2020年至2021年的新冠疫情, 讓全世界進入了困難模式,國家的經濟運行不得不放緩腳步。這不僅給每個人造成了很多不便,更是給人們所依賴的企業組織,造成了巨大的影響。每一個微觀個體所感受的只是自己身邊肉眼可見的影響,但是,對於企業肉眼不可見的地方,還有萬千變化在悄然發生。 疫情之下,中小企業“危中有機” 據國家工信部統計,截至2019年年底,中小微企業已經達到3000萬家。但是,根據調查顯示,疫情

react , coffeescript , bootstrap , webkit , Javascript

收藏 評論

熱飯班長 - 異常處理策略

const api = { getData: () = { return new Promise((resolve) = { resolve(undefined); }); }, }; 沒有異常處理,會導致程序崩潰 const getLogo = async () = { const res = await api.getData() return re

react , vue.js , 異常處理 , 前端 , Javascript

收藏 評論

貓子 - 在 Braft Editor 中實現自定義 Emoji 功能

功能描述 實現在 Braft Editor 中添加和顯示自定義的 emoji 圖標(給出的是一系列的圖片地址,形如:https: xxx/emoji1.png)。主要功能點包括:點擊對應的 emoji 後在編輯器中渲染對應的 emoji 圖標,以及支持將發送的消息“重新編輯”回填到編輯框中。 開發過程 初始嘗試 最初,我試圖使用自定義的 EmojiSelect 組件來實現這個功能。但這種方法只能

react , draftjs , 富文本編輯器 , Javascript

收藏 評論

陽哥 - 類組件中如何使用hook函數

靈感來源來自一個面試官問我為什麼hook函數不能在class類組件中使用?如何在class類組件中使用呢? 第一個問題你們自己可以百度一下晚上有,今天着重講解一下第二個問題。 碰到這個問題首先要進行分析: (1)hook函數在什麼情況下可以調用?答:函數最外層可以調用Hook。 =可不可以衍生一個函數代替class類組件調用?答:高階組件就可以,因為高階組件本身就是從高階函

react , class , hoc , hook

收藏 評論

兔子先森 - vue3使用mitt事件管理

註冊mitt main.ts註冊 import { createApp } from 'vue'; import App from './App.vue'; // 導入mitt import mitt from 'mitt'; const app = createApp(App); app.config.globalProperties.$mitt = mitt(); app.mount('

react , vue.js , HTML , 前端 , Javascript

收藏 評論

erishen - 從零到一:打造一個支持 RAG 的智能聊天應用

基於 Next.js 15 + Vercel AI SDK + 本地向量存儲的完整實現 在 AI 大模型快速發展的今天,如何構建一個既實用又具備先進功能的聊天應用成為了許多開發者關注的話題。本文將分享我從零開始構建一個集成了 RAG(檢索增強生成)、多輪對話管理、本地向量存儲 的現代化 AI 聊天應用的完整過程。 ✨ 核心特性 🤖 智能對話系統 流式響應:基於 Vercel AI SDK

react , 教程 , 知識 , typescript , html5

收藏 評論

大狗 - Dva 5分鐘上手指南

該篇文章適合的閲讀人羣:剛接手公司項目,技術棧為react,狀態管理直接用的dva,但是不太瞭解redux、redux-saga、react-redux的人員,想要快速上手業務開發,看這篇就對了! 1. Dva是什麼? dva 首先是一個基於 redux 和 redux-saga 的數據流方案,然後為了簡化開發體驗,dva 還額外內置了 react-router 和 fetch,所以也可以理解為一

react , dva.js , 前端 , Javascript

收藏 評論

奔放的炒粉 - 存儲包含學習參數(權重、偏置)、優化器狀態和訓練元數據的模型狀態字典

PyTorch 模型可以保存為兩種格式:.pt:此格式保存整個模型, 包括其架構和學習參數。.pth:此格式僅保存模型的狀態字典,其中包括模型的學習參數和一些元數據。 PyTorch 格式基於 Python 的pickle模塊,該模塊用於序列化 Python 對象。 為了理解pickle 的工作原理,讓我們看以下示例: import pickle mode

react , webkit , chrome-devtools

收藏 評論