OpenReplay 博客
我们遗忘的前端性能优化技巧
前端性能技巧依然重要：图片尺寸、font-display、preconnect、懒加载、defer、async 和事件节流。
使用 Claude Code 和 Remotion 制作视频
Claude Code 与 Remotion 指南：通过提示生成 MP4 视频，理解帧数计算，修正 Sequence，并在 Studio 中调试渲染。
JSON-LD 如何帮助 AI 理解您的网站
JSON-LD 和 Schema.org 帮助 AI 爬虫与 Google 理解你的网站。了解如何用服务器端结构化数据避免 JavaScript 注入遗漏。
面向开发者的 5 款开源电商平台
比较 Medusa、Saleor、Vendure、Sylius 和 Shopware 的无头电商后端、Next.js 支持、API 及自托管取舍。
Vite+ 入门指南
快速上手 Vite+：安装 vp、创建项目、运行 dev、check、test 和 build，并了解统一的 vite.config.ts 工作流。
使用 Animata 实现复制即用的动画效果
Animata 提供可复制粘贴的 React 动画组件，结合 Tailwind CSS 和 shadcn/ui 工作流，按组件加载轻量依赖。
如何修复烦人的 404 favicon.ico 未找到错误
通过在站点根目录提供favicon并添加SVG、PNG和Apple Touch Icon标签，修复favicon.ico的404错误。
Pretext 与 Web 文本布局的未来
Pretext 是一个 TypeScript 库，可在 DOM 外测量文本以避免 reflow，加速虚拟列表、聊天流和 masonry 布局。
Cookies 与 localStorage 在 JWT 身份认证中的对比
JWT 认证中 Cookies 与 localStorage 怎么选：对比 XSS 和 CSRF 风险、HttpOnly、Secure、SameSite 及现代令牌存储方式。
永远不应该缓存的内容
不要缓存用户专属数据、认证响应、JWT 和敏感页面。了解如何安全使用 no-store、private 和 bfcache。
审计 GitHub Workflows 的安全风险
审计 GitHub Actions 的令牌权限、脚本注入、pull_request_target 风险、动作固定、自托管 runner 和 OIDC。
如何为 Electron 应用添加身份验证
在 Electron 应用中添加身份验证：OAuth 2.0 PKCE、系统浏览器登录、深链接或 loopback 重定向，以及 safeStorage 安全保存令牌。
Next.js 的五种替代方案
2026年可替代Next.js的5种框架：React Router v7、Astro 5、SvelteKit、Nuxt 4 和 TanStack Start。
为 JavaScript 项目选择静态站点生成器
比较 Astro 6、Eleventy 3、Next.js 16、Nuxt 4 和 SvelteKit，选择适合 JavaScript 项目的静态站点生成器。
使用 prefers-reduced-motion 实现无障碍动画
使用 prefers-reduced-motion 通过 CSS、JavaScript 和 Motion.dev 安全减少动画，并了解测试方法与 WCAG 指南。
使用 CSS all: unset 移除原生元素样式
使用 all: unset 清除 CSS 原生样式，重置按钮和表单控件，并恢复 focus-visible 可访问性。
你应该从 npm 切换到 pnpm 吗?
要从 npm 切换到 pnpm 吗？比较依赖隔离、磁盘节省、工作区协作和 pnpm 11 的构建脚本审批。
如何检测浏览器标签页变为非活动状态
使用 Page Visibility API 检测浏览器标签页何时变为非活动状态。借助 visibilitychange 暂停轮询、媒体播放和分析跟踪。
Chrome 扩展 Manifest V3 详解
解析 Manifest V3：service worker、declarativeNetRequest、chrome.action、Offscreen API，以及为何移除 MV2 后台页面和远程代码。
React Compiler 与手动 Memoization 对比
React Compiler 与手动记忆化：了解 React.memo、useMemo 和 useCallback 何时自动生效，以及何时仍需手动控制。
智能体浏览器入门
Agentic浏览器正在改变Web应用。了解它们与Selenium的区别、语义化HTML的重要性，以及开发者需要应对的安全风险。
如何在浏览器中持久化表单状态
用 localStorage、sessionStorage 或 IndexedDB 在浏览器中持久保存表单状态。了解自动保存、恢复字段和安全清除数据。
使用 Knip 清理无用文件和依赖
Knip可检测 JavaScript 和 TypeScript 项目中的未使用文件、导出和依赖项，并支持自动修复与 CI 清理。
使用 Scheduler API 在浏览器中处理后台任务
使用 Scheduler API 通过 scheduler.postTask() 和 scheduler.yield() 优先安排主线程任务，并说明支持检测与降级方案。