语言
English English Vietnamese (Tiếng Việt) Vietnamese (Tiếng Việt) Chinese (简体中文) Chinese (简体中文) Portuguese (Brazil) (Português do Brasil) Portuguese (Brazil) (Português do Brasil) Spanish (Español) Spanish (Español) Indonesian (Bahasa Indonesia) Indonesian (Bahasa Indonesia)
代码压缩

代码压缩

在浏览器中压缩 JavaScript、CSS 和 HTML 代码,缩减文件体积,附实时压缩统计和各语言专属选项。

代码压缩是什么?

代码压缩工具会压缩 JavaScript、CSS 和 HTML,通过去掉浏览器运行时不需要的注释、空白和其他字符来缩减文件体积。代码的功能完全不变,只是变得更小 —— 因此页面下载更快,占用的带宽也更少。

它专为想要拿到生产可用产物、又不想安装构建工具的前端和 Web 开发者打造。选择一个语言标签,粘贴代码,压缩结果便会自动出现,并附带实时压缩统计。JavaScript 由 Terser 处理,CSS 和 HTML 则采用有针对性的规则,保留那些必须原样留存的部分。

隐私至上:每一次压缩都在你的浏览器中运行。你的代码绝不会被上传、记录或存储到任何服务器。

如何压缩你的代码

1

选择语言

在顶部选择 JavaScriptCSSHTML 标签。每个标签都会加载对应的引擎和各自的一套选项。

2

粘贴或上传代码

在左侧的输入面板中输入或粘贴,或使用上传从你的设备载入文件。点击示例即可填入当前语言的示例代码。

3

调整选项

在工具栏中调整各语言专属的选项 —— 例如 JavaScript 的重命名变量压缩优化,或 HTML 的合并空白。一旦你更改设置,输出便会重新压缩。

4

查看并导出

结果会带着语法高亮显示在右侧,统计栏则展示原始体积、压缩后体积和节省量。然后复制输出,或将其下载为文件。

快捷键:停顿片刻后,输出会随你的输入自动压缩。按 Ctrl + Enter 可立即压缩,或在编辑器中按 Tab 插入四个空格。

功能特性

基于 Terser 的 JavaScript

用 Terser 压缩现代 ES6+ 代码,可切换重命名变量、压缩优化、移除 console 和移除 debugger。

CSS 压缩

移除注释、合并空白、缩短十六进制颜色并优化零值,同时保持 calc() 原样不变。

HTML 压缩

去掉注释、合并空白,并可选地移除可选闭合标签和多余的属性引号。

自动压缩

输出会随你的输入自动更新,并带有防抖处理,因此永远不会落后于你的输入。

压缩统计

每次运行后查看原始体积、压缩后体积和精确的节省百分比。

语法高亮输出

压缩结果用 Prism.js 高亮显示,保持可读,而不是挤成密密麻麻的一行。

上传与下载

直接从你的设备载入文件,并以正确的扩展名下载压缩后的输出。

一键复制与示例

立即把结果复制到剪贴板,或载入内置的示例代码来试用每种语言。

100% 本地处理

所有处理都在你的浏览器中进行,因此你的代码绝不会离开你的设备。

各语言的选项

JavaScript

重命名变量会缩短本地名称,压缩优化会执行死代码消除,移除 console / 移除 debugger 会删除调试语句。

CSS

可切换移除注释;合并空白、缩短十六进制和优化零值会自动运行。

HTML

可切换移除注释、合并空白和移除可选标签,以控制对标记的精简力度。

常见问题

什么是代码压缩?

代码压缩会去掉浏览器运行代码时不需要的一切 —— 注释、多余空白和可选语法 —— 而不改变代码的功能。结果是一个更小的文件,加载和解析都更快。

压缩代码能提升页面速度吗?

能。更小的 JavaScript、CSS 和 HTML 文件下载更快,也让浏览器需要读取的字符更少,从而降低带宽消耗,并帮助页面更早进入可交互状态。

我的代码会被发送到服务器吗?

不会。所有压缩都在你的浏览器本地进行。你的代码绝不会被上传或存储到任何地方 —— 即使是专有源码也只留在你的设备上。

压缩会破坏我的代码吗?

它的设计宗旨就是保持功能不变。Terser 会安全地重命名 JavaScript 标识符,HTML 会保持 prescriptstyletextarea 的内容原样不动,CSS 也会保持 calc() 表达式完整。与任何构建步骤一样,请测试产物并保留你的原始源码。

“重命名变量”是什么意思?

重命名会缩短本地变量和函数的名称 —— 例如把 myVariable 变成 a —— 在不影响代码运行的前提下削减文件体积。它只重命名那些不对外暴露的标识符。

这里能把代码还原(反压缩)吗?

不能 —— 本工具只做压缩。要把压缩后的代码美化或重新格式化,请改用代码格式化或美化工具。请注意,被重命名的 JavaScript 名称无法还原成原名,因为这些信息在压缩过程中已被移除。

我能省下多少文件体积?

这取决于语言和编码风格。开启重命名变量和压缩优化的 JavaScript 通常能减小 40–70%,CSS 一般为 20–40%,HTML 则视空白和注释的多少为 10–30%。统计栏会显示你代码的精确节省量。

压缩(minify)和 gzip 有什么区别?

压缩会改写源码本身以去掉不必要的字符,因此无论在哪里读取,文件都更小。gzip 则是在传输时应用的服务器端压缩,由浏览器透明地解压。两者可以叠加:先压缩,再让服务器对结果做 gzip,得到最小的下载体积。

我能一次压缩多个文件吗?

本工具每次处理一个文件。压缩完成后,上传一个新文件或粘贴新的代码即可处理下一个。

在输入面板粘贴代码,稍候片刻即可自动压缩
Ctrl+Enter 可立即压缩,无需等待
在编辑器中按 Tab 插入四个空格作为缩进
点击示例载入当前语言的示例代码
针对 JavaScript,开启移除 console 可删除所有 console.log() 调用
查看压缩统计栏,了解节省了多少文件体积
所有压缩都在你的浏览器中运行 — 不会向任何服务器发送代码
想了解更多? 阅读文档 →
1/8
开始输入以搜索...
搜索中...
未找到结果
请尝试使用不同的关键词搜索