banner
innei

innei

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

南京行·工作进展与心情焦虑

南京 前些天的突然决定,买了去南京的高铁票。就这样周末去了一趟南京。 没有任何行程,毫无计划。 第一站,去朋友家里。 出地铁后,看到了南京小米。 然后是 https://x.com/__oQuery/status/1829828314003095747 晚上,去了夫子庙和秦淮河…
cover
cover
cover
cover

ShadowDOM 中样式隔离和继承

如果你了解 Web Component 那么你一定知道 Shadow DOM,Shadow DOM 是用于创建一个与外部隔离的 DOM Tree,在微前端中比较常见,可以在内部定义任何样式也不会污染外部的样式,但是也因为这个特征导致 Shadow DOM 中也不会继承任何外部样式…
cover

再渡轮回

经过了五天的努力,我已经通关了「黑神话・悟空」。这是一款既塞尔达传说之后让我如此沉迷的。每天梦里都有那棍法。 上回说到,我在 PS5 上玩到虎先锋就一直过不去。于是我在 Steam 平台购买了,使用风灵月影来降低游戏的难度。按我的游戏水平…
从讨厌写作到乐于分享:我与写博客的心路历程
另外我更觉得写博客这种事... 写 比 发 更重要。 当你有一箩筐精心打磨的内容无论到哪个平台都应该是会受到关注的,而且既然此人都能打磨出高质量的内容他必然也是领域精英,也一定可以收获社媒声量。 所以不用担心没人看,我们都该担心自己愿不愿意写。 今天的主题从川哥的一个推文讲起…
忙碌中的思索:生活、工作与娱乐
已经有一个月没有写点什么了,但是好像也无话可写。 行业交流 最近这段时间,开始忙起来了。除了主业之外,也尝试开始发展一些副业。很快,新工作也已经两个月了,内心也还是有些焦虑的,也不知道之后试用期能不能过。 这些天和行业内的老人也算是进行了一些交流,大环境真的挺差的…
在 Nest.js 中使用 Auth.js
Auth.js 是一个可以非常方便接入 OAuth 的一个身份验证库。他起初是为 Next.js 而设计。如今官方以为其供一些常用框架的集成,但是不幸的是,并没有 Nest.js 的官方支持。 这篇文章将从零开始构造一个适用于 Nest.js 的 AuthModule…
cover
cover
cover

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

本文介绍一种可以在 Electron 应用中显示原生菜单,并且在非 Electron 环境(Web)下也可以显示自定义的上下文菜单的方法。通过封装一个通用组件和调用方法,在两套环境中交互统一。 调出原生菜单 在 Electron 中,默认情况下右键并不会弹出类似 Chrome…
被裁员后的恐惧
最近一直都在被裁员之后的恐惧中。 不知不觉已经过去了一个多月了。 上个月的 9 号下午,通知我被优化了,没有任何的征兆,原因是项目组资金砍半了,人也要砍半。想起来也是伤感,自从离开小红书后,选择降薪去到一家喜欢的公司做充满艺术感的产品,本以为能够一直做下去…
cover
cover

一种适用于 Zustand 和 React Query 的前端数据管理方式

在上面这篇文章中提到当 React Query 托管的数据过于复杂或者冗余的话,后续在前端做数据的乐观更新会变得非常复杂并且不可控。 Note 乐观更新指,前端在进行数据操作时,通过 API 方式向服务器提交数据,之后数据在 UI 上的更新由前端提供,不需要等待服务器的响应…
探讨 React Server Component 与 React Client Component 的环境隔离与实践
前言 我们知道,在 React Server Component 环境下,渲染的运行时永远都是在 server 的,而在 RCC 中,两者环境都可能存在。为了控制一个库的引用方只能处于某种环境中,而在另一个环境中报错,我们可以使用 client-only 或者 server…
cover
cover

跨仓库全自动构建项目并部署到服务器

最近,Vercel 又又对价格进行了调整,让 Hobby 越来越不够用了,所以放弃了使用 Vercel,转向私有服务器部署 Next.js 项目。 对于私有服务器的部署体验是非常不友好的。第一,没有 Vercel 这样的全自动部署,也不能及时回滚。第二,Next.js…
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

INFP-T的内心世界、个人站点更新

超共鸣!INFP-T 的内心剧场 在网上看到这样一个视频,简直说的就是我了。 https://www.bilibili.com/video/BV13F4m1F7Cf 社交五分钟,复盘一整天,晚上睡觉都在想。甚至在群里说了句话没人回,都要思考是不是自己说错了啥…
cover

利好 SharedWorker 实现跨页面单例 WebSocket

在之前的文章中,我详细的介绍了站点的实时人数是如何实现的?,在方案中,我留下了一个悬念,如何使用 SharedWorker 在页面之间共享 Socket 实例,实现跨页面单例 WebSocket。 动机 探索这个问题的背景是无意间在知乎看到了 WebSocket 的一个问题…
cover
cover
cover

一次构建多处部署 - Next.js Runtime Env

我们一般通过控制 env 的方式去做到 "Build once, deploy many" 哲学。但是在 Next.js 中,环境变量分为两种,一个种是可被用于 Client 侧的 NEXT_PUBLIC_ 开头的环境变量,另一个种是只能被用于 Server 侧的环境变量…
cover

站点的实时人数是如何实现的?

经常光顾我站的读者应该都看到过我站底部有显示当前在线的人数。在不久之前我还为其增加了显示当前正在阅读具体哪篇文章的人数排行,并且在具体的某篇文章左侧增加时间线,用于展示当前所有正在阅读此文章的读者阅读进度。 如果你看过我站的开源项目的话大概知道此站是由 Mix Space…
Ownership of this blog data is guaranteed by blockchain and smart contracts to the creator alone.