更好地撰写博客

CSS 视图过渡的入门级指南

Yash Raj Bharti 2025 年 10 月 9 日 阅读时间 5 分钟

了解如何通过视图过渡为多页应用程序带来流畅的动画导航。只需一行 CSS，即可实现页面间的无缝过渡。

MDN 新前端发布

MDN 团队 2025 年 8 月 19 日 阅读时间 2 分钟

MDN 焕然一新 🎉。了解发生了哪些变化、改进了哪些方面以及网站导航变得更加流畅。

从编码器到解码器的像素数据

Polina Gurtovaia 2025 年 8 月 4 日 阅读时间 18 分钟

从单个像素到屏幕上完全解码的图像，原始像素数据经过转换、压缩并高效传输。了解那些在不损失可感知质量的情况下缩小图像信息的技术和优化方法。

庆祝 MDN 20 周年

Joe Walker 2025 年 7 月 23 日 阅读时间 3 分钟

MDN 20 岁了！让我们回顾一下我们是如何开始的，MDN 如何成为 Web 开发人员最值得信赖的资源，它对开放 Web 的影响，是的，还有蛋糕。

面向人类和设备的颜色模型

Polina Gurtovaia 2025 年 5 月 6 日 阅读时间 17 分钟

图像为 Web 带来了更多的色彩和活力。本文描述了图像如何被人和不同设备表示，并详细介绍了色彩空间和视觉理论。

h1 元素的默认样式正在改变

Simon Pieters 2025 年 4 月 11 日 阅读时间 4 分钟

浏览器开始推出嵌套节标题默认 UA 样式的更改。本文描述了即将到来的更改，如何识别它是否是您网站上的问题，以及符合规范和结构更好的页面的提示。

全球隐私控制的影响

Lola Odelola 2025 年 3 月 15 日 阅读时间 5 分钟

随着其第一个工作草案的发布，全球隐私控制 (GPC) 正在成为一项正式的隐私标准。让我们看看它对开发人员和用户意味着什么。

JavaScript Temporal 即将到来

Brian Smith 2025 年 1 月 24 日 阅读时间 5 分钟

一种处理日期和时间的新方法正在添加到 JavaScript 中。让我们看看 Temporal，它解决了哪些问题，当前的状况，以及您将在 MDN 上关于它的新文档中找到什么。

通过优化图像加载来修复您网站的最大内容绘制 (Largest Contentful Paint)

DebugBear 2025 年 1 月 13 日 阅读时间 10 分钟

学习提高您网站最大内容绘制指标（Core Web Vitals 的一部分）的技术。

MDN 2024 内容项目

Vadim Makeev 2025 年 1 月 8 日 阅读时间 9 分钟

让我们回顾一下 MDN Web Docs 2024 年的内容项目，重点介绍我们的最佳选择和推荐阅读，以及 MDN 2025 年的下一步计划。

MDN 上的新学习体验

Ruth John 2024 年 12 月 20 日 阅读时间 4 分钟

MDN 上新增了一个“学习 Web 开发”部分，它将 MDN 课程与“学习”部分合并。以下是这些更改的背景、新内容以及您未来可以期待看到的内容。

通过每日编程挑战倒计时迎接假期

Sonal Sood 2024 年 12 月 1 日 阅读时间 2 分钟

今年 12 月加入 JavaScriptmas，参加每日编程挑战，旨在提升您的技能并带来节日乐趣。在 Scrimba 上解决挑战，学习新知识，并有机会赢取激动人心的奖品！

监控和优化网站性能

DebugBear 2024 年 11 月 11 日 阅读时间 12 分钟

了解如何阅读网络请求瀑布图、识别常见的网络性能问题以及优化页面渲染。

如何获得您的第一份开发人员工作

Per Borgen 2024 年 11 月 1 日 阅读时间 11 分钟

这里有六种获得第一份开发人员工作的有效策略。如果您是自学成才或没有传统计算机科学学位进入技术行业，这些策略尤其相关。

介绍新的 MDN 社区页面

Pranshu Khanna 2024 年 10 月 15 日 阅读时间 5 分钟

我们很高兴地宣布新的 MDN 社区页面，它将成为一个表彰贡献者和贡献者参与的中心。

修复您网站的 JavaScript 性能

DebugBear 2024 年 10 月 9 日 阅读时间 9 分钟

了解与过度使用 JavaScript 相关的鲜为人知的 Web 性能瓶颈，例如长时间任务、大型捆绑包大小和水合问题。

重返校园！通过 MDN 和 Scrimba 加速您的学习

Hermina Condei 2024 年 9 月 12 日 阅读时间 2 分钟

对于我们许多人来说，假期已经结束，是时候集中精力了。现在是深入学习 Web 开发的理想时机，您很幸运——MDN 和 Scrimba 在下个月将对精选课程提供 30% 的折扣！

使用 Streams API 高效处理数据

Vultr 2024 年 9 月 6 日 阅读时间 6 分钟

本文演示了如何在 Web 应用程序中使用 Streams API 即时获取和转换文本。通过在数据到达时进行处理，这种方法可以提高性能、响应能力和资源效率。

使用 Intl.Segmenter 在 JavaScript 中进行区域敏感文本分段

Brian Smith 2024 年 9 月 3 日 阅读时间 5 分钟

了解如何使用 Intl.Segmenter 在 JavaScript 中进行区域敏感文本分段，以简化本地化、计算不同语言的单词或句子等。

使用 Git stash 优化您的工作流程

GitLab 2024 年 8 月 28 日 阅读时间 8 分钟

了解如何使用 Git stash 分解大型提交。探索在切换分支时保存工作的更好方法。

如何跨设备调试移动应用程序

LambdaTest 2024 年 8 月 7 日 阅读时间 8 分钟

本文探讨了移动应用程序调试是什么、常用技术以及如何在多个设备上调试移动应用程序。

使用 HTML details 元素创建独占手风琴

Brian Smith 2024 年 8 月 5 日 阅读时间 3 分钟

HTML details 元素的“name”属性正在获得更多浏览器支持。了解此功能如何允许创建独占手风琴而无需从头开始编写脚本小部件。

探索 Broadcast Channel API 用于跨标签页通信

Vultr 2024 年 7 月 12 日 阅读时间 4 分钟

本文解释了如何使用 Broadcast Channel API 构建同步和相互连接的 Web 应用程序。

MDN 与 Scrimba 合作，提升 Web 开发学习体验

Hermina Condei 2024 年 7 月 9 日 阅读时间 6 分钟

我们选择 Scrimba 作为 MDN 课程的合作伙伴。这篇博文探讨了此次合作的实际意义，以及我们将如何共同提供更好的 Web 教育体验。

介绍 MDN HTTP 观察站

Hermina Condei 2024 年 7 月 2 日 阅读时间 7 分钟

HTTP 观察站于 2016 年首次发布，凭借其有用的安全审计和教育材料的结合，在 Web 社区中广受欢迎。快进到 2024 年，我们很高兴地宣布观察站的新家是 MDN。请继续阅读以了解更多信息，并热烈欢迎 HTTP 观察站！

使用 Next.js 进行静态站点生成 (SSG)

Vultr 2024 年 6 月 28 日 阅读时间 7 分钟

本指南解释了如何使用 Next.js 中的静态站点生成来构建具有快速加载时间并专注于性能的可伸缩和安全的 Web 应用程序。

新的 JavaScript Set 方法

Brian Smith 2024 年 6 月 24 日 阅读时间 5 分钟

新的 JavaScript Set 方法正在跨浏览器推出。了解 Set、如何使用这些方法比较不同的 Set、创建具有特定属性的新 Set 等。

保护 API：Express 速率限制和减速

Vultr 2024 年 5 月 28 日 阅读时间 6 分钟

本指南向您介绍了速率限制和减速机制。了解如何在 Express 应用程序中应用减速和速率限制机制。

使用 Page Visibility API

Brian Smith 2024 年 5 月 10 日 阅读时间 6 分钟

本文探讨了页面可见性是什么、如何在应用程序中使用 Page Visibility API，并描述了如果您围绕此功能构建功能时应避免的陷阱。

MDN 博客发布一周年

MDN 团队 2024 年 5 月 3 日 阅读时间 5 分钟

自 2023 年 5 月以来，我们一直在 MDN 博客上撰写有关 Web 开发和 Web 平台的内容。以下是我们的亮点和热门文章以及我们的最爱。

在 Vultr 上设置 Service Worker

Vultr 2024 年 4 月 23 日 阅读时间 6 分钟

本指南向您介绍了 Service Worker 及其生命周期。了解如何在 Vultr 上使用 HTTPS 部署包含 Service Worker 的项目。

Interop 2023：MDN 更新

Brian Smith 2024 年 3 月 27 日 阅读时间 6 分钟

Interop 2023 已成功结束，Interop 2024 项目现已正式启动。了解 Interop 是什么，发现 Interop 2023 在 MDN 上的更新，并了解 Web 即将推出的内容。

在 Vultr 上使用 Jest 测试 JavaScript

Vultr 2024 年 3 月 22 日 阅读时间 7 分钟

本指南向您介绍了常见的测试类型和测试约定。了解如何在 Vultr 上使用 Jest 测试 JavaScript。

使用 CSS color-mix() 函数创建调色板

Michelle Barker 2024 年 3 月 8 日 阅读时间 7 分钟

Web 上的颜色处理变得更加有趣！在本文中，我们将探讨如何使用 CSS color-mix() 函数创建调色板中的变体。

使用 TestGrid 实现传统测试自动化的现代化

TestGrid 2024 年 2 月 29 日 阅读时间 12 分钟

本文反思了使用 Selenium 和 Appium 的传统测试自动化方法。了解如何使用 TestGrid 的统一测试平台来增强传统方法，并利用现代无代码测试技术。

起飞：MDN 课程启动

Hermina Condei 2024 年 2 月 27 日 阅读时间 6 分钟

期待已久的 MDN 课程现已在 MDN 上线，为行业新手提供了前端开发基本技能和最佳实践的结构化指南。在本文中了解所有关键细节。

创建有效的技术文档

Dipika Bhattacharya 2024 年 2 月 13 日 阅读时间 7 分钟

本文概述了创建有效技术文档所需的核心组件。学习最佳实践，使您的文档清晰、一致且结构良好。

在 Vultr 上利用 Bun：Node.js 的卓越替代品

Vultr 2024 年 1 月 17 日 阅读时间 5 分钟

本指南解释了 Bun 作为运行时包管理器和打包器的功能。它还解释了内置 Bun API 的优点以及如何使用 Bun 的 Vultr 市场应用程序。

CSS 中的边框图像：Interop 2023 的一个关键重点领域

Dipika Bhattacharya 2023 年 12 月 19 日 阅读时间 10 分钟

为了与 Interop 2023 强调的跨浏览器一致性保持一致，本文将引导您了解各种 `border-image` 属性，您可以控制这些属性来创建引人入胜的网页设计。了解如何使用自定义图形来增强您网站的外观，使其在不同浏览器中保持一致。

使用 OpenLLM 和 Vultr Cloud GPU 构建 AI 驱动的应用程序

Vultr 2023 年 12 月 12 日 阅读时间 7 分钟

了解如何使用 OpenLLM 和 Vultr Cloud GPU 构建 AI 驱动的应用程序。本指南演示了如何使用大型语言模型生成 API 响应。它还涵盖了设置 Nginx 服务器和实施 SSL 安全性的说明。

2024 年告别第三方 Cookie

Chris Mills 2023 年 12 月 8 日 阅读时间 8 分钟

2023 年末传来了关于 Web 隐私的好消息，Chrome 宣布将在 2024 年加入 Firefox 和 Safari 的行列，弃用第三方 Cookie。了解有关这些变化的更多详细信息，以及它们对 Web 开发人员意味着什么。

Baseline 在 MDN 上的演变

Vadim Makeev 2023 年 12 月 5 日 阅读时间 4 分钟

今天，我们正在更新 Baseline 小部件并引入一个新小部件，同时更新了 Baseline 的定义。

开发人员必备：JavaScript 控制台方法

Brian Smith 2023 年 11 月 30 日 阅读时间 6 分钟

JavaScript 控制台是 Web 开发必不可少的工具。学习使用控制台显示数据和调试代码的新颖有趣方法。

CSS 容器查询入门

Michelle Barker 2023 年 11 月 16 日 阅读时间 8 分钟

CSS 容器查询是我们 CSS 布局工具箱中一个强大的新工具。本文将深入探讨使用容器查询构建布局的实用性。

在 Vultr 上使用 PM2 部署 Node.js 应用程序

Vultr 2023 年 11 月 8 日 阅读时间 7 分钟

了解如何使用 PM2 在 Vultr 上部署 Node.js 应用程序以创建持久服务。本指南演示了如何通过 PM2 集群模式高效利用资源。它还涵盖了 Nginx 服务器设置和 SSL 安全性。

VS Code：初学者提示和技巧

Dipika Bhattacharya 2023 年 11 月 7 日 阅读时间 8 分钟

发现使用功能强大的集成开发环境 Visual Studio Code (VS Code) 的基本提示和技巧。了解如何利用其集成编辑功能和 Git 支持，并探索一些扩展。

即将推出：MDN Observatory 2.0

MDN 团队 2023 年 10 月 25 日 阅读时间 2 分钟

Observatory 2.0 即将作为 Mozilla Developer Network 的一部分推出，名为 MDN Observatory，包含新的安全评分标准和其他激动人心的更新。

使用 GitLab 的条件 CI/CD 流水线优化 DevSecOps 工作流程

GitLab 2023 年 10 月 23 日 阅读时间 8 分钟

本指南探讨了各种类型的 CI/CD 流水线，并帮助您了解它们的特定用例。了解如何利用规则创建高效的 DevSecOps 工作流程。

Web 可持续性简介

Michelle Barker 2023 年 10 月 11 日 阅读时间 8 分钟

网页设计师和开发人员可以做些什么来构建一个更具可持续性的 Web？本文探讨了 Web 技术对环境的影响，并研究了我们可以构建更环保网站的一些方法。

从 GitHub 无缝迁移到 GitLab：分步指南

GitLab 2023 年 10 月 5 日 阅读时间 9 分钟

考虑从 GitHub 迁移到 GitLab 吗？本指南揭开了迁移过程的神秘面纱，解决了希望在两个平台之间无缝过渡的 DevSecOps 团队的常见问题。本文提供了一步一步的指导教程，说明如何将数据从 GitHub 迁移到 GitLab。

宣布 MDN 前端开发人员课程

MDN 团队 2023 年 8 月 14 日 阅读时间 5 分钟

MDN 为有抱负的前端开发人员创建了一门课程，以帮助他们建立有益和成功的职业生涯。了解课程内容、适用人群以及其背后的研究。

使用 linear() 函数在 CSS 动画中创建自定义缓动效果

Michelle Barker 2023 年 8 月 1 日 阅读时间 10 分钟

新的 CSS linear() 计时函数可在动画中实现自定义缓动。通过实际示例，探索 linear() 与用于缓动的其他计时函数相比如何工作。

保护您的 CDN：为什么要以及如何使用 SRI

Terence Eden 2023 年 7 月 21 日 阅读时间 4 分钟

依赖外部资源来构建您的网站总是充满风险的。了解如何通过使用 SRI 保护第三方内容来保护您的网站及其访问者。

CSS 中的滚动进度动画

Michelle Barker 2023 年 7 月 14 日 阅读时间 7 分钟

滚动驱动动画即将登陆 CSS！在本文中，我们将介绍几种类型的动画，并学习如何将它们链接到容器的滚动进度。

AI Explain 的反思：事后总结

MDN 团队 2023 年 7 月 11 日 阅读时间 10 分钟

我们最近发布了一个名为 AI Explain 的功能，但目前已将其回滚。在本文中，我们将深入探讨 AI Explain 背后的故事：它的开发、发布以及导致我们暂停的原因。

开发人员必备：如何使用 grep 搜索代码

Brian Smith 2023 年 7 月 3 日 阅读时间 9 分钟

grep 是一个强大的工具，用于从终端搜索代码。本文将向您展示如何使用 grep 以及它为何是开发人员的必备工具。

介绍 AI Help (Beta)：您的 Web 开发伴侣

Hermina Condei 2023 年 6 月 27 日 阅读时间 3 分钟

我们正在推出由 MDN 和 OpenAI GPT 3.5 提供支持的 AI 助手，以实时回答您的所有 Web 开发问题。

学习如何在 CSS 颜色中使用 HSL 中的色相

Brian Smith 2023 年 6 月 26 日 阅读时间 7 分钟

色相是 CSS 中定义颜色的明亮方式。了解色相、色轮、如何使用颜色函数以及如何使用色相为您的网站创建充满活力的调色板。

介绍 MDN Playground：让您的代码焕发生机！

Florian Dieminger 2023 年 6 月 22 日 阅读时间 6 分钟

MDN 正在推出一个代码 Playground。用户可以原型化想法并将所有实时示例扩展为交互式体验。

MDN 文档更新：CSS 选择器和媒体查询、WebGPU 和 WebTransport API、渐进式 Web 应用

Dipika Bhattacharya 2023 年 6 月 13 日 阅读时间 6 分钟

发现 CSS :lang()、实验性媒体查询、使用 WebGPU 操作图形、使用 WebTransport 进行客户端-服务器通信、ECMAScript 模块支持等等。

如何仅用一个 JavaScript 函数绘制任何规则形状

Ruth John 2023 年 5 月 26 日 阅读时间 4 分钟

学习如何使用 JavaScript 通过一个函数在 HTML 画布上绘制任何规则形状，以及如何修改它以绘制多个形状。

MDN JavaScript 正则表达式的新参考页面

Brian Smith 2023 年 5 月 23 日 阅读时间 5 分钟

查看 MDN 关于 JavaScript 正则表达式参考页面的最新更新，包括关于子功能和浏览器兼容性信息的新部分。

庆祝全球无障碍宣传日

Schalk Neethling 2023 年 5 月 18 日 阅读时间 6 分钟

为了庆祝 2023 年全球无障碍宣传日，我们分享了一些工具和指南，以帮助您使 Web 更具无障碍性。

使用 HTML 地标角色改善无障碍性

Schalk Neethling 2023 年 5 月 15 日 阅读时间 11 分钟

了解 HTML 地标角色是什么、它们如何改善无障碍性以及如何有效地将它们包含在您的网站上。

介绍 Baseline：稳定 Web 功能的统一视图

Hermina Condei 2023 年 5 月 10 日 阅读时间 3 分钟

MDN 在实施 WebDX 社区小组的努力方面处于领先地位，为开发人员提供了清晰简单的 Web 平台基线。

:`not()` 如何链接多个选择器

Dipika Bhattacharya 2023 年 5 月 5 日 阅读时间 4 分钟

了解当将多个选择器作为参数传递时，CSS `not()` 伪类如何表现。

CSS 颜色（Level 4）中的新函数、渐变和色相

Brian Smith 2023 年 5 月 3 日 阅读时间 9 分钟

了解 CSS 颜色模块 Level 4 中的新功能，包括颜色空间、颜色函数、炫酷渐变以及对宽色域显示的支持。

欢迎来到 MDN 博客

Ruth John 2023 年 5 月 3 日 阅读时间 2 分钟

MDN 博客作为 MDN Web Docs 的延伸，发布 Web 开发新闻、教程和见解，帮助您发现、学习和为 Web 创作。