XIAOYU
CODE / SYSTEMS / IDEAS
首页
实验室
AI 对话
友链
关于
笔记
搜索
⌘ / Ctrl K
LOADING / 正在加载
全部笔记 | XIAOYU
THE KNOWLEDGE INDEX
全部笔记
在实践中理解技术，在记录中沉淀方法。
关键词
分类
全部分类
AI探索
其他
基础原理
工程实践
性能与优化
系统设计
项目经验
标签
全部标签
AB Test
Ai
Amplitude
A股
Bug
canvas
CDN
Embedding
HTTP
Java
Js
NextJS
Prisma
Python
RAG
React
TCP/IP
ts
UI
UX
Web
Web Worker
WebSocket
事件循环
代码
作用域
内存泄漏
分享
分布式
博客
后端开发
多线程
宏任务
工程实践
幂等
开发
微任务
性能优化
投资
浏览器
渲染
漏洞
爬虫
监控
系统设计
经验分享
网络
闭包
筛选笔记
重置
共 46 篇公开笔记
快速搭建技术体系
结合业务规模和团队经验选择技术组合，兼顾交付效率与后续维护。 前后端框架 前端：需要SSR服务可以使用NuxtJS或者NextJS。本博客使用NextJS做SSR。SEO效果经过实证，不到三天，被谷歌收录了好几篇技术文章。这也可能和各大搜索引擎厂商的蜘蛛爬取实现机制有关。当时百度尚未收录，具体原因还需要结合抓取与索引情况排查。 后端：如选择 SOFA Boot 作为后端开发框架，它是基于 Spri...
#分享
2025/04/29
XiaoYu
NextJS鉴权方案: Next-Auth
在 Next.js 应用中实现安全、灵活的登录系统，NextAuth.js 是一种常用选择。本文示例按 NextAuth.js v4 的 API 编写，其他主要版本的配置方式可能不同。 特点包括： 支持多种登录方式（OAuth、Credentials、Email 等） 支持 JWT 会话及配合适配器使用的数据库会话 简单集成，适配 Next.js App Router (/app) 新架构 安全加...
#分享
2025/04/28
XiaoYu
前端性能优化总结
从测量结果出发改善加载与交互体验 一、前言：为什么性能优化如此重要？ 性能优化，永远是前端工程师绕不开的主题。无论是巨头公司的大型应用，还是个人博客、小程序，只要有用户交互，就离不开对加载速度和交互体验的要求。 一些资料曾引用过下面的统计数字，但原文没有附研究来源和适用条件，因此不能将它们当作所有站点的通用结论： 页面加载时间每延迟 1 秒，转化率下降 7%。 超过 3 秒未加载完成的页面，53%...
#分享
2025/04/26
XiaoYu
使用NextJs做SSR站点的优点
传统单页应用（SPA）为什么需要额外关注 SEO？ 传统 Vue、React 的 SPA 网站，访问流程是这样的： 但是，搜索引擎爬虫（蜘蛛） 一般做的是快速扫描，它不会像正常用户那样耐心地跑完你的 JS。 所以它看到的就是这样的： 页面内容是空的。 结果就是 页面没有正文 没有 h1、h2 没有文章内容 没有 SEO Meta 标签 爬虫根本不知道这个页面讲了什么。 最终结论 单页应用天然不利于...
#分享
2025/04/26
XiaoYu
小程序单元测试
这里记录使用 Jest 和 miniprogram-simulate 为小程序接入单元测试的过程。 快照策略 概述 快照由 Jest 根据 miniprogram-simulate 渲染出的组件结构生成。 <u>快照测试的作用并不是自动验证正确性，而是当组件输出的结构或 DOM 有“变化”时，提醒开发者去“确认变更是否合理”。</u> 生成步骤 编写断言 执行测试 执行测试后，会自动生成快照文件。...
#分享
2025/04/15
XiaoYu
快速构建小程序：FinClip 凡泰极客
官网：https://www.finclip.com/ 背景 主要用于给 App 接入小程序运行能力。凡泰提供一些平台（Android、iOS等）的接入SDK，再借助凡泰的私有化部署能力，在线管理自己的小程序应用。包含开发，编译上传，配置审核版本，审批版本，发布上线等完整的小程序发布流程。 快速接入 快速给自己的APP接入小程序能力，过程大致如下： APP对接FinClip SDK。 私有化部署F...
#分享
2025/04/14
XiaoYu
Next.js 15 - generateMetadata 函数参数使用
generateMetadata 分页页面需要可访问、可分享的地址时，可以把当前页码放进查询参数。元信息也应与当前页内容保持一致。 例如如下URL 我们一般使用 来做参数查询。 在Next.js 15 - generateMetadata 函数中使用需要注意。 函数的参数 是一个异步的 Promise，因此在使用其属性之前，必须先使用 关键字进行解析。 之前的错误写法是 下面说明这一写法的问题。 ...
#分享
#NextJS
2024/11/03
XiaoYu
AB Test 新选择：Amplitude
介绍 A/B Test 将符合条件的用户分配到不同实验组，比较不同方案在约定指标上的表现。新旧版本对比是其中一种用法；分组、曝光和指标口径需要保持一致，才能合理解释结果。 Amplitude 提供实验及行为分析相关产品。 https://amplitude.com/ 假设我们有一个 Web 页面需要AB Test。借助 Amplitude，可以按下面的步骤接入事件采集。实验分组和曝光记录还需另外配...
#分享
#Amplitude
#AB Test
#监控
2024/07/07
XiaoYu
未来Web标准趋势
未来 Web 标准发展方向总览 示例 视觉色彩标准 OKLCH Display-P3 色域支持（超广色域，像 iPhone、MacBook Pro 显示器） HDR on Web（真正的高动态范围画质） CSS Color Module Level 4 / 5 → 引入 color-mix(), relative-color-syntax 等，支持动态颜色混合。 🎯 意义：让网站在高端屏幕上也能...
#Js
#开发
#Web
2023/10/06
XiaoYu
关于博客
博客主要记录： 技术实践与踩坑总结。 系统设计与工程经验。 一些思考。 关于开发 技术栈 前端：Next.js 15 (App Router)、React、TypeScript、Tailwind CSS。 后端：Node.js、Prisma ORM、MySQL。 认证与授权：Next-Auth 集成。 部署与管理： 考虑到之前宿主机出现安全问题的经历，当前博客采用全面容器化方式部署运行（宿主机只安...
#分享
#博客
#NextJS
#开发
#Prisma
2017/09/30
XiaoYu
Previous
1
More pages
3
4