css • 2024-12-15
滚动条驱动的动画是一个新的 CSS 特性，已经在部分现代浏览器中实现了，我们以前要实现滚动条动画效果时，可以使用一些 Javascript 库来实现，例如ScrollMagic，Gsap等动画库，现在 CSS 也可以实现一些基本的滚动驱动动画功能了。
分享 • 2024-12-11
Cursor 是一款集成 AI 技术的代码编辑器，由Anysphere 实验室开发，基于 VSCode 深度定制。支持多种编程语言，并内置了GPT-4等AI模型，提供智能代码补全、代码生成、代码编辑和聊天功能。对于我这种穷比来说每个月20美元肯定是付不起，废话不多说，接下来分享两种免费白嫖方案。
框架 • 2024-12-07
React 19中引入的useOptimistic Hook，了解如何通过乐观更新技术提升用户体验。本文详细介绍了乐观更新的概念，useOptimistic的使用方法以及在评论列表场景下的实际应用示例。
css • 2024-12-03
为了更好的用户体验，通常会给网站实现黑白主题切换，可以让用户适用白天黑夜阅读体验，那目前有哪些实现黑白主题切换的实现呢？分别为 CSS prefers-color-scheme 媒体查询、window.matchMedia 方法以及 CSS light-dark () 函数。
其他 • 2024-09-21
之前已经介绍过FCP，本文介绍与之相对应的LCP。通过上文得知，FCP衡量的是页面首次渲染出有意义的内容的时间点，这通常包括文本、图像、非白色画布或SVG的渲染，可以让用户感知到网页正在加载。那么LCP又是什么?
其他 • 2024-09-01
首次内容渲染（First Contentful Paint，简称FCP）是一个以用户角度来衡量的性能指标，它衡量的是用户在**网页加载过程中首次看到内容的时间点**。这个指标之所以重要，是因为它代表了用户在屏幕上第一次看到网页内容的时刻，从而影响用户对网页加载速度的感知。一个快速的FCP可以增强用户的体验，**让用户感知到页面正在加载内容**。
服务器 • 2024-08-23
最近搭建服务了解到了Caddy这个反向代理服务器，它比Nginx轻量，Caddy内置了一个ACME（Automatic Certificate Management Environment）客户端，它能够自动与 Let's Encrypt 等证书颁发机构通信，获取免费的SSL/TLS证书。免去手动配置的流程，配置代理也非常简单。
css • 2024-07-27
编写响应式样式代码是一个前端开发工程师必备的技能之一，媒体查询是响应式设计的核心，它可以根据设备的特性（如屏幕宽度、分辨率等）来应用不同的样式规则。
工具 • 2024-07-13
monorepo是一种软件开发实践，它允许多个项目或包共享一个版本控制系统仓库。这种方式可以提高代码复用性，简化依赖管理，提高开发效率。那么前端如何管理单仓多个项目呢？比如如何管理项目之间各自的依赖包，项目A如何引用项目B等等。pnpm workspace可以帮我们解决这个问题。
其他 • 2024-07-08
在用户访问网站难免需要打开多个标签页的场景，有时候打开多个标签页，就需要做一些信息同步，比如打开多个问卷调查标签，当一个标签页填写完，需要通知其他标签页进行提示已填写，或者多个标签页需要公用一个长连接，或者页面国际化切换需要通知其他页签进行语种切换等等。诸多场景都需要进行标签页通信，本文介绍几种常见的多标签页通信的方案，看官可以按照实际需求选择合适自己的方案。
工具 • 2024-07-06
GitLab CI/CD 是 GitLab 提供的持续集成与持续部署工具，允许你在代码提交后自动运行构建、测试和部署等任务。要配置 GitLab CI/CD，你需要在仓库根目录下创建一个 `.gitlab-ci.yml` 文件，其中包含一系列的作业（Jobs）定义。
框架 • 2024-06-22
日常开发中都需要编写一些通用的组件来给多个模块复用，为了提高组件的稳定性和可靠性，通常需要编写一些测试用例来保证组件在开发阶段能的质量和确保功能一致性。
