解决 WebSocket 在 Nginx 下无法正常连接问题，以及配置 Nginx 过程中需要注意的问题和 Websocket 地址在不同浏览器的兼容处理。

本文讲述多边形计算库clipper-lib的js版本用法，js版本的clipper-lib库和同类库比较，功能支持上更完善，且处理效率高，是前端处理多边形计算的首选方案，支持的计算包括多边形的并集、交集、差集、异或、面积、周长等。

Clipper lib 库对直线和多边形执行裁剪和偏移。支持所有四种布尔裁剪操作——交集、并并、差和异或。多边形可以是任何形状，包括自相交多边形。

定义以PixiJS开发的游戏、图形编辑器等应用中的鼠标样式，实现鼠标样式个性化，增强人机交互的直观性、趣味性，提升游戏、编辑器中鼠标交互操作的用户体验。

收集并整理日常工作中频繁用到的一些git操作命令。

Next.js 中使用 UnoCSS 原子 css 解决方案，并使用 UnoCSS icons 纯 css 图标方案替代传统 svg 图标，实现样式与 html 的分离。

Next.js(v13+) 使用 contentlayer 创建 MDX 博客应用，Contentlayer 是一个内容SDK，可验证您的内容并将其转换为类型安全的 JSON 数据，您可以轻松地import将其添加到应用程序的页面中，其具有重量轻，易于使用、 出色的开发体验以及快速的构建能力和高性能页面的优点的。

Next.js(v13+) 使用 @next/mdx、next-mdx-remote 创建 MDX 博客应用。本文中主要描述使用 next-mdx-remote 加载远端 markdown 文章内容的处理过程，以及过程中的一些优化及异常处理。

在进行SSR服务端渲染时，因服务器与客户端所在地时区的不同，造成应用在服务器端渲染时，格式化后的时间结果与实际结果出现偏差。偏差大小取决于服务器时区与客户端时区差值。

利用 css 的属性 mask、mask-composite，实现带有圆角、渐变、且内容背景透明的边框。解决高度个性化网站应用中大量使用图片问题，减少图片请求提升网站整体性能。

使用docker-compose为不熟练Docker，但又不太想在本地物理机上安装各种复杂的开发环境的同学，提供一个简单便利的基于docker的Nginx环境配置流程。

拖拽组件库dnd-kit介绍，及其在ant-design中与Table集成实现表格行拖拽排序。

E2E测试中，使用Playwright测试工具测试网页时对具有需要鉴权的页面进行身份验证，在此过程中所产生的问题以及对应的解决方案介绍。

浏览器缓存是浏览器端保存数据用于快速读取或避免重复资源请求的优化机制，有效的缓存使用可以避免重复的网络请求和浏览器快速地读取本地数据，整体上加速网页展示给用户。

在响应式网站中涉及视频播放、可视化图表、图片等一些高宽需要固定的比例时，同时满足布局在不同尺寸下自动适应，这里我们需要利用CSS的一些属性如：padding-top/bottom、视窗单位、aspect-ratio来实现宽高比例（纵横比）布局。

几种常用的纯CSS实现元素居中展示方案，包含了水平居中、垂直居中、水平垂直居中。不同方案适用于不同场景，可根据具体场景选择合适的方案，主要用到flex、position、transform等css属性。

React组件各生命周期介绍，您可以将此生命周期图用作备忘单，以便忘记时查询，该生命周期介绍仅适用于react 15.x 版本。

解决工作中对文本域输入操作，添加元素时的光标在文本域光中的定位。

借助该CSS3伪类:checked实现表单元素复选框与单选框的样式自定义，依照UI设计稿高度还原表单元素于HTML中，解决默认表单元素复选框与单选框在不同操作系统、不同浏览器中的表现差异，提升视觉效果与用户体验。

CSS3新特性定义浏览器滚动条样式，彻底丢弃传统js添加html元素定义方式，简化自定义滚动条配置流程，统一各平台滚动条在浏览器中的表现形式，提升用户体验。

通过几个简单示例介绍CSS3新的子选择器nth-child，实现一些比较惊艳的效果。

收录工作中常用的用户名、密码、邮箱、URL、IP、时间、数字等JS正则表达式，以及正则表达式知识介绍和工具推荐，提升工作开发中的效率。