banner
innei

innei

写代码是因为爱,写到世界充满爱!
github
telegram
twitter

react

cover
cover
cover

一种在 Electron 和 Web 环境下显示原生及自定义菜单的通用方法

本文介绍一种可以在 Electron 应用中显示原生菜单,并且在非 Electron 环境(Web)下也可以显示自定义的上下文菜单的方法。通过封装一个通用组件和调用方法,在两套环境中交互统一。 调出原生菜单 在 Electron 中,默认情况下右键并不会弹出类似 Chrome…
cover

为什么是 RSC (二)

渐进式渲染 Important 渐进式渲染,或者称作流式渲染。这不是一个只能在 RSC 中可以享受到的特征,这种渲染模式和 Suspense、 renderToPipeableStream 或 renderToReadableStream 有关。 但是在 Next.js…
cover
cover
cover
cover

Shiki 性能优化 - 按需加载语法解析

Shiki 是一个非常优秀的代码高亮库。 https://github.com/shikijs/shiki 众所周知,代码高亮库包含了众多的语言解析器,导致加载比较缓慢,并且加载太多无用的解析器造成大量流量浪费。 这一节我们来实现按需加载 Shiki 需要的语言解析器。 动态加载…
cover
cover
cover
cover

为什么是 RSC (一)

React 19 会正式引入 React Server Component (RSC) 的概念,Client Component 和 Server Component 从此将会正式分离。Next.js 从 13 版本就开始支持 Server Component。那么为什么是…
cover
cover
cover

2024 年,该如何写一个全面兼容的 NPM 库

最近,把 rc-modal 做成了一个库。写代码倒是不难,无非就是把原本的代码封装抽象一下。倒是发包,和作为使用者如何使用这个包难住了。 首先,我们知道现在一个 npm 包如果不做 ESM Pure 的话,你需要考虑兼容 CJS/ESM,node 老版本和新版本(吃不吃…
模块化的请求数据统一管理的构想
在一个复杂的业务场景下,一个页面中被拆分多个组件,或者是多个组件共同组成一个独立的模块而不受到其他模块的影响。如下图所示。 Copy {"type":"excalidraw","version":2,"source":"http://localhost:2323…
为什么我更推荐命令式 Modal
更新 24.3:已封装成组件库,欢迎大家来使用。 https://github.com/Innei/rc-modal Modal 模态对话框。 一个非常常见的组件。不管是 C 端还是 B 端都能看到它的身影。但是你真的会用它吗? 什么是声明式 Modal 组件库中一般都会内置这类…
超级组合!NestJS + tRPC 与CSR绝佳搭档React Query,开启全新开发时代!
最近在重写一个 NestJS 的项目,想着这么集成下 tRPC 供管理面板前端使用。原本在管理面板都是裸写的 API 接口,也没有任何响应类型。如果使用 tRPC 的话,不仅不用手写 API 还能做到 End-to-End Type-safe. tRPC 是什么 RPC…
cover
cover
cover

浅谈 NextJS RSC/SSR 中数据水合和持久化数据(二)

上回说道在 SSR 中如何用 React Query 实现数据水合。这期来谈谈如何用 Jotai 实现。 使用 Jotai 对数据的管理后期对数据的修改和对 UI 的反应也会更加方便。 改造 注入数据 在 layout.tsx 我们依然使用 queryClient 去获取数据…
使用 Jotai 抽离组件状态的经验
Jotai 是一个非常优秀的基于原子模型的 React 状态管理库。它采用自下而上的方法来构建全局 React 状态管理,通过组合原子来构建状态,并根据原子依赖关系优化渲染。这解决了 React 上下文的额外重新渲染问题,并消除了对 memoization 的需求。 使用…
cover
cover
cover
cover
cover

浅谈 NextJS RSC/SSR 中数据水合和持久化数据(一)

因为最近在重写一个个人站点,尝试了 NextJS 全新的 RSC 架构之后,也踩了很多坑。打算用此文记录一些实践。 在 SSR 架构中,如果请求数据在服务端,在转到 CSR 渲染时依赖 SSR 的数据时,必须要保证在 CSR 时拿到的数据和服务端一致,只有这样还能保证两端渲染一致…
React 应用中性能优化的经验(二)
上回说道在 React 应用中列表组件应该去优化,今天复杂组件应该怎么写。Jotai 和 Zustand 咕咕咕了,下次再说。 写过大厂屎山的大伙应该都经历过,一个组件能有上百甚至上千行都是常事。一个组件内部嵌套一个组件也是常事。简单总结了下三不要: 不要在 Component…
此部落格數據所有權由區塊鏈加密技術和智能合約保障僅歸創作者所有。