一句话概括 CSS Grid 是二维布局系统，通过将页面划分为行和列的网格，让开发者同时控制水平和垂直方向的排列，它是 CSS 诞生以来最强大的布局工具——让复杂的页面结构变得像”搭积木”一样直观。 背景与意义 Flexbox 解决了一维布局的痛点——无论是横排还是竖排，它都处理得非常优雅。但当我们面对真正的二维布局（如：一个完整的页面结构、复杂的仪表盘、照片墙）时，Flexbox 就...

一句话概括 Flexbox 是一维布局模型，通过 flex-direction 定义主轴方向，让容器内的子元素沿水平或垂直方向灵活排列、自动伸缩、精准对齐——它是现代 CSS 布局中最核心的”万能排班师”。 背景与意义 在 Flexbox 出现之前，CSS 布局主要靠什么？float 排左浮右，inline-block 调垂直对齐，table 模拟栅格，position: absolu...

一句话概括 CSS 盒模型是布局的基石——每个 HTML 元素都是一个矩形盒子，由 content、padding、border、margin 四个区域组成，理解盒模型精确的尺寸计算方式和 box-sizing 的行为差异，是写出可控布局的前提。 背景与意义 几乎所有前端工程师在职业生涯中都遇到过一个”幽灵”——一个明明设置了 width: 200px 的元素，在页面上却占了 250p...

一句话概括 Docker 是一个容器化平台，通过将应用及其依赖打包成轻量级镜像，实现了”一次构建，到处运行”的部署一致性，从前端开发者的视角看，它是解决”在我电脑上明明是好的”这一千古难题的最强武器。 背景与意义 如果你是前端工程师，大概率有过这样的经历：本地开发环境一切正常，代码 push 到仓库后，运维说”启动不起来”；或者后端同事说”环境配置太麻烦，你帮我搭一下”。更有甚者，新同...

一句话概括 Nginx 是一个高性能的 HTTP 和反向代理服务器，以事件驱动的异步架构实现高并发能力（单机 5万+ 并发连接），从前端开发者的视角看，它是你部署静态资源、配置 API 代理、实现负载均衡时最得力的”看门人”。 背景与意义 你大概率经历过这样的场景：用 npm run build 打包完前端项目，把 dist 目录扔到服务器上，但不知道跑在 3000 端口的 npm s...

一句话概括 Redis 是一个基于内存的键值存储系统，以极致的读写性能（单机 10万+ QPS）和丰富的数据结构成为现代 Web 应用缓存与数据层核心组件，从前端开发者视角掌握它等于掌握了后端性能优化的第一把钥匙。 背景与意义 作为一名前端工程师，你大概率在项目中遇到过这样的场景：页面加载速度慢、接口响应缓慢、高并发场景下后端被打爆。你可能尝试过加 CDN、上 SSR、做懒加载，但有没...

一句话概括 MongoDB 是最流行的 NoSQL 文档数据库，它用 BSON 格式的文档来存储数据（类似于 JSON 对象），摒弃了传统数据库的表结构约束，本文将从前端开发者的视角出发，深入讲解 MongoDB 的文档模型设计、聚合查询管线以及索引优化策略。 背景与意义 每个前端开发者都熟稔 JSON。你在前端接到的 API 返回值是 JSON、配置是 JSON、甚至 React/V...

一句话概括 MySQL 是世界上最流行的开源关系型数据库，本文从前端开发者的视角出发，用 JavaScript/Node.js 的类比来讲解 MySQL 的核心概念——CRUD 操作、索引原理和事务机制，帮助前端同学快速建立后端数据库的思维模型。 背景与意义 作为一个前端开发者，你可能会想：「我为什么要学数据库？」 看看你日常开发中会遇到的场景：登录注册需要查询用户表、商品列表需要分...

一句话概括 Express 和 Koa 是 Node.js 最流行的两个 Web 框架，它们的核心都是中间件机制——Express 采用线性中间件执行模型，Koa 则使用洋葱模型，本文将从源码层面剖析两者的中间件调度原理、路由实现、错误处理机制以及设计哲学差异。 背景与意义 在 Node.js 诞生之初，用原生的 http.createServer 直接处理请求是件非常原始的事情： ...

一句话概括 Node.js 虽然主线程是单线程的，但通过 child_process、cluster 和 worker_threads 分别提供了多进程、多实例和多线程的并发能力，本文将深入剖析这三者的原理、适用场景以及如何在 Node.js 中有效利用多核 CPU 和并行计算。 背景与意义 「Node.js 是单线程的」这句话常常被误解为「Node.js 只能在一个 CPU 核心上运...