#开源 沉浸式翻译的开源替代

https://github.com/Bistutu/FluentRead

GitHub

GitHub - Bistutu/FluentRead: Open Immersive Translate. A revolutionary open-source browser translation plugin that enables everyone…

Open Immersive Translate. A revolutionary open-source browser translation plugin that enables everyone to have a native-like reading experience. 开源的沉浸式翻译，一款革命性的浏览器翻译插件，让所有人都能够拥有母语般的阅读体验。 - Bistutu/...

#React react-hook-form现在支持上面提到的标准schema。

https://github.com/react-hook-form/resolvers/releases/tag/v4.0.0

GitHub

Release v4.0.0 · react-hook-form/resolvers

4.0.0 (2025-02-10)
Bug Fixes

add support for names option (#713) (985c48d)
arktypeResolver: resolve type error when schema is defined from an ArkType scope (#732) (3233667)
handle raw: true option...

#开源 标准约束 standard schema 这个一定要了解，未来检验肯定会走向统一。

https://github.com/standard-schema/standard-schema

GitHub

GitHub - standard-schema/standard-schema: A standard interface for TypeScript schema validation libraries

A standard interface for TypeScript schema validation libraries - standard-schema/standard-schema

#开源 自定义解释器的工具库

https://github.com/ohmjs/ohm

GitHub

GitHub - ohmjs/ohm: A library and language for building parsers, interpreters, compilers, etc.

A library and language for building parsers, interpreters, compilers, etc. - ohmjs/ohm

#CSS style observer一个可以监听样式变化的库

https://observe.style/

observe.style

Style Observer

A robust, production-ready library to observe CSS property changes.

#React #CSS 动画集合组件

https://www.reactbits.dev/

React Bits

An open source collection of high quality, animated, interactive & fully customizable React components for building stunning, memorable user interfaces.

#React 已经正式废弃的CRA，现在可以使用CTA😊

https://github.com/TanStack/create-tsrouter-app

GitHub

GitHub - TanStack/create-tsrouter-app: Create-tsrouter-app is drop-in replacement for create-react-app that builds TanStack Router…

Create-tsrouter-app is drop-in replacement for create-react-app that builds TanStack Router based SPA applications - TanStack/create-tsrouter-app

#TS 在 Node.js 项目中设置和使用 TypeScript。它从创建项目开始，逐步指导如何安装和配置 TypeScript，设置源代码目录和入口文件，并通过工具如 tsx 和 dotenv 实现高效的开发和环境变量管理。

https://www.robinwieruch.de/typescript-node-js/

www.robinwieruch.de

TypeScript in a Node.js Project

Learn how to set up a TypeScript Node.js project from scratch with this step-by-step guide. Configure TypeScript, install dependencies, manage environment variables, and streamline development with tsx ...

#开源 #React CRA正式废弃，这是一个CRA迁移到vite的工具

https://github.com/bhbs/viject

GitHub

GitHub - bhbs/viject: A tool for migrating your React app from react-scripts (Create React App) to Vite

A tool for migrating your React app from react-scripts (Create React App) to Vite - bhbs/viject

#开源 Prettier 3.5.0更新啦

https://prettier.io/blog/2025/02/09/3.5.0

prettier.io

Prettier 3.5: New objectWrap option, experimentalOperatorPosition option and TS config file support! · Prettier

This release includes a lot of bug fixes and the following new features:

#文章
React Router 的内部工作机制，包括其作为框架的特性、初始请求处理、页面加载、客户端导航、数据加载策略、状态管理以及上下文更新等内容。

https://tigerabrodi.blog/how-react-router-works-under-the-hood

Tiger's Place

How React Router works under the hood

The ins and outs of the framework.

#开发工具 腾讯的一键部署平台

https://edgeone.ai/zh/products/pages

Tencent EdgeOne

EdgeOne Pages: 快速构建和部署您的网页应用

EdgeOne Pages使您能够快速创建和启动精美的网站，利用边缘技术实现最佳性能。

#开源 #网页工具 网页播放器样式

https://player.style/

player.style

player.style - Video & audio player themes for every web player & framework

Video and audio player themes that work for any web player (Video.js, Youtube embeds, and more), and with every web app framework (HTML, React, and more). Open source and built with Media Chrome so they’re fully customizable using just HTML and CSS.

#开源 谷歌NotebookLM开源版本

https://github.com/lfnovo/open-notebook#js-repo-pjax-container

GitHub

GitHub - lfnovo/open-notebook: An Open Source implementation of Notebook LM with more flexibility and features

An Open Source implementation of Notebook LM with more flexibility and features - lfnovo/open-notebook

#开源 抄作业系列，RAG组件，流式渲染

https://github.com/upstash/rag-chat-component#js-repo-pjax-container

GitHub

GitHub - upstash/rag-chat-component: React component for RAG-enabled AI Assistant

React component for RAG-enabled AI Assistant. Contribute to upstash/rag-chat-component development by creating an account on GitHub.

#文章 简化网站的 favicon 配置，只需要六个文件！

https://blog.ghkk.net/post/how-to-favicon-in-2021-six-files-that-fit-most-needs/

Haukeng's Blog

在2021应该怎样配置 Favicon：用六个文件来适配大多数需求

是时候重新思考如何为现代浏览器配置一套 favicon 并且阻止发疯的图标生成器。今天，仅仅只是为了在浏览器 tab 栏和触控屏上显示一个小小的网站 logo，前端开发者就必须处理二十几个静态 PNG 文件。请继续阅读，看看如何使用更聪明方法来获得一套符合现代大多数需求的最小图标集。

#CSS #文章 HTML、CSS（借助Sass简化开发）创建一个具有倾斜角度窗口和悬停效果的轮播图。

https://frontendmasters.com/blog/creating-an-angled-slider/

Frontend Masters

Creating an Angled Slider

Let’s walk through how this slider with angled content and hover effect works:

#文章 关于如何使用TypeScript发布基于ESM（ECMAScript模块）的npm包的教程文章。

https://2ality.com/2025/02/typescript-esm-packages.html

2Ality

Tutorial: publishing ESM-based npm packages with TypeScript

During the last two years, ESM support in TypeScript, Node.js and browsers has made a lot of progress. In this blog post, I explain my modern setup that is relatively simple – compared to what we had to do in the past:

#文章 富文本编辑器怎么选择？虽然文章夹带私货，但是对比了大多富文本库

https://liveblocks.io/blog/which-rich-text-editor-framework-should-you-choose-in-2025

liveblocks.io

Which rich text editor framework should you choose in 2025? | Liveblocks Blog

Looking to integrate a WYSIWYG editor into your JavaScript app? This comparison dives into the best frameworks available, including Tiptap, Lexical, BlockNote, and Slate.

#文章 js分解长任务的方法

以下是文章中提到的几种方案：


1.setTimeout()+递归
通过递归调用setTimeout()，将任务拆分成多个事件循环的tick，避免长时间阻塞主线程。


2.异步/等待+定时器
利用async/await结合setTimeout()，简化任务拆分逻辑，避免递归，代码更简洁易读。


3.scheduler.postTask()
使用Scheduler接口的postTask()方法，以更高效和可控的方式调度任务，支持设置任务优先级。


4.scheduler.yield()
通过Scheduler接口的yield()方法，在任务执行过程中释放主线程，让浏览器有机会处理其他任务，保持响应性。


5.requestAnimationFrame()
利用requestAnimationFrame()在浏览器重绘周期之前调度任务，适合与渲染相关的任务，但可能影响渲染性能。


6.MessageChannel()
通过MessageChannel实现任务拆分，类似于零延迟的setTimeout()，但实现较为复杂，适合对性能要求较高的场景。


7.Web Workers
将任务移至主线程之外的Web Workers中执行，完全避免阻塞主线程，适合可以离线处理的复杂任务。

https://macarthur.me/posts/long-tasks/

Alex MacArthur

There are a lot of ways to break up long tasks in JavaScript.

It's very common to intentionally break up long, expensive tasks over multiple ticks of the event loop. But there are sure are a lot of approaches to choose from. Let's explore them.