HTML 缩小?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/728260/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-28 23:34:37  来源:igfitidea点击:

HTML minification?

htmlminify

提问by Paulo

Is there a online tool that we can input the HTMLsource of a page into and will minify the code?

是否有在线工具可以将页面的HTML源代码输入到其中并缩小代码?

I would do that for aspx files as it is not a good idea to make the webserver gzip them...

我会对aspx文件这样做,因为让网络服务器gzip它们不是一个好主意......

回答by Paulo

Perhaps try HTML Compressor, here's a before and after table showing what it can do (including for Stack Overflow itself):

也许尝试HTML Compressor,这是一个前后表,显示了它可以做什么(包括堆栈溢出本身):

Sorry, markdown has no concept of tables

抱歉,markdown 没有表格的概念

It features many selections for optimizing your pages up to and including script minimizing (ompressor, Google Closure Compiler, your own compressor) where it would be safe. The default option set is quite conservative, so you can start with that and experiment with enabling more aggressive options.

它具有许多优化页面的选项,包括脚本最小化(压缩器、Google Closure 编译器、您自己的压缩器)在安全的地方。默认选项集非常保守,因此您可以从它开始并尝试启用更激进的选项。

The project is extremely well documented and supported.

该项目有很好的文档记录和支持。

回答by Zac Thompson

Don't do this. Or rather, if you insist on it, do it after any more significant site optimizations are complete. Chances are very high that the cost/benefit for this effort is negligible, especiallyif you were planning to manually use online tools to deal with each page.

不要这样做。或者更确切地说,如果您坚持这样做,请在完成任何更重要的站点优化后进行。这项工作的成本/收益微不足道的可能性非常高,特别是如果您计划手动使用在线工具来处理每个页面。

Use YSlowor Page Speedto determine what you reallyneed to do to optimize your pages. My guess is that reducing bytes of HTML will not be your site's biggest problem. It's much more likely that compression, cache management, image optimization, etc will make a bigger difference to the performance of your site overall. Those tools will show you what the biggest problems are -- if you've dealt with them all and still find that HTML minification makes a significant difference, go for it.

使用YSlowPage Speed来确定您真正需要做什么来优化您的页面。我的猜测是,减少 HTML 的字节不会成为您网站的最大问题。压缩、缓存管理、图像优化等更有可能对您网站的整体性能产生更大的影响。这些工具将向您展示最大的问题是什么——如果您已经解决了所有问题,但仍然发现 HTML 缩小会产生重大影响,那就去做吧。

(If you're sure you want to go for it, and you use Apache httpd, you might consider using mod_pagespeedand turning on some of the options to reduce whitespace, etc., but be aware of the risks.)

(如果您确定要这样做,并且使用 Apache httpd,则可以考虑使用mod_pagespeed并打开一些选项以减少空格等,但要注意风险。)

回答by Salvador Dali

Here is a short answer to your question: you should minify your HTML, CSS, JS. There is an easy to use tool which is called grunt. It allows you to automate a lot of tasks. Among them JS, CSS, HTMLminification, file concatenationand many others.

这是对您的问题的简短回答:您应该缩小您的 HTML、CSS、JS。有一个易于使用的工具,称为grunt。它允许您自动执行许多任务。其中JSCSSHTML缩小,文件连结其他许多人

The answers written here are extremely outdated or even sometimes does not make sense. A lot of things changed from old 2009, so I will try to answer this properly.

这里写的答案非常过时,甚至有时没有意义。很多事情从 2009 年开始发生了变化,所以我会尝试正确回答这个问题。

Short answer - you should definitely minify HTML. It is trivial today and gives approximately 5% speedup. For longer answer read the whole answer

简短的回答 -你绝对应该缩小 HTML。今天它是微不足道的,并且可以提供大约5% 的加速。要获得更长的答案,请阅读整个答案

Back in old days people were manually minifying css/js (by running it through some specific tool to minify it). It was kind of hard to automate the process and definitely required some skills. Knowing that a lot of high level sites even right now are not using gzip (which is trivial), it is understandable that people were reluctant in minifying html.

过去人们手动缩小 css/js(通​​过一些特定的工具运行它来缩小它)。自动化这个过程有点困难,肯定需要一些技能。知道即使现在很多高级站点都没有使用 gzip(这是微不足道的),人们不愿意缩小 html 是可以理解的。

So why were people minifying js, but not html? When you minify JS, you do the following things:

那么为什么人们缩小 js 而不是 html呢?当您缩小 JS 时,您会执行以下操作:

  • remove comments
  • remove blanks (tabs, spaces, newlines)
  • change long names to short (var isUserLoggedInto var a)
  • 删除评论
  • 删除空格(制表符、空格、换行符)
  • 将长名称更改为短名称 ( var isUserLoggedInto var a)

Which gave a lot of improvement even at old days. But in html you were not able to change long names for short, also there was almost nothing to comment during that time. So the only thing that was left is to remove spaces and newlines. Which gives only small amount of improvement.

即使在过去,这也带来了很多改进。但是在 html 中,您无法将长名称更改为短名称,而且在那段时间几乎没有什么可评论的。所以唯一剩下的就是删除空格和换行符。这只会带来少量的改进。

One wrong argument written here is that because content is served with gzip, minification does not make sense.This is totally wrong. Yes, it makes sense that gzip decrease the improvement of minification, but why should you gzip comments, whitespaces if you can properly trim them and gzip only important part. It is the same as if you have a folder to archive which has some crap that you will never use and you decide to just zip it instead of cleaning up and zip it.

这里写的一个错误论点是,因为内容是用 gzip 提供的,缩小没有意义。这是完全错误的。是的,gzip 减少了缩小的改进是有道理的,但是如果您可以正确修剪注释和空格并且只对重要部分进行 gzip,为什么还要 gzip 呢?这就像您有一个文件夹要存档,其中有一些您永远不会使用的废话,并且您决定只压缩它而不是清理并压缩它。

Another argument why it pointless to do minification is that it is tedious.Maybe this was true in 2009, but new tools appeared after this time. Right now you do not need to manually minify your markup. With things like Gruntit is trivial to install grunt-contrib-htmlmin(relies on HTMLMinifierby @kangax) and to configure it to minify your html. All you need is like 2 hours to learn grunt and to configure everything and then everything is done automatically in less than a second. Sounds that 1 second (which you can even automate to do nothing with grunt-contrib-watch) is not really so bad for approximately 5% of improvement (even with gzip).

进行缩小毫无意义的另一个论点是它很乏味。也许 2009 年确实如此,但此后出现了新工具。现在您不需要手动缩小标记。使用Grunt之类的东西,安装grunt-contrib-htmlmin(依赖于@kangax的 HTMLMinifier)并配置它来缩小你的 html是微不足道的。您只需要 2 个小时来学习 grunt 并配置所有内容,然后一切都会在不到一秒钟的时间内自动完成。听起来 1 秒(您甚至可以使用grunt-contrib-watch自动执行任何操作)对于大约 5% 的改进(即使使用 gzip)来说并不是那么糟糕。

One more argument is that CSS and JS are static, and HTML is generated by the server so you can not pre-minify it. This was also true in 2009, but currently moreand moresites are looking like a single page app, where the server is thin and the client is doing all the routing, templating and other logic. So the server is only giving you JSONand client renders it. Here you have a lot of html for the page and different templates.

另一个论点是 CSS 和 JS 是静态的,而 HTML 是由服务器生成的,因此您无法预先缩小它。这也是真正在2009年,但目前更多的更多的网站都看起来像一个单页的应用程序,其中,服务器是薄客户端是做所有的路由,模板化和其他逻辑。所以服务器只给你JSON和客户端呈现它。在这里你有很多页面的 html 和不同的模板。

So to finish my thoughts:

所以要结束我的想法:

  • google is minifying html.
  • pageSpeedis asking your to minify html
  • it is trivial to do
  • it gives ~5% of improvement
  • it is not the same as gzip
  • 谷歌正在缩小 html。
  • pageSpeed要求您缩小 html
  • 做起来很简单
  • 它提供了约 5% 的改进
  • 它与 gzip 不同

回答by Salvador Dali

I wrote a web tool to minify HTML. http://prettydiff.com/?m=minify&html

我写了一个网络工具来缩小 HTML。 http://prettydiff.com/?m=minify&html

This tool operates using these rules:

此工具使用以下规则运行:

  • All HTML comments are removed
  • 删除所有 HTML 注释
  • Runs of white space characters are converted to single space characters
  • 空白字符的运行被转换为单个空格字符
  • Unnecessary white space characters inside tags are removed
  • 标签内不必要的空白字符被删除
  • White space characters between two tags where one of these two tags is not a singleton is removed
  • 删除两个标签之间的空白字符,其中这两个标签之一不是单例
  • All content inside a styletag is presumed to be CSS and is minified as such
  • style标签内的所有内容都被假定为 CSS 并被缩小为这样
  • All content inside a scripttag is presumed to be JavaScript, unless provided a different media type, and then minified as such
  • script标签内的所有内容都被假定为 JavaScript,除非提供不同的媒体类型,然后像这样缩小
    • The CSS and JavaScript minification uses a heavily forked form of JSMin. This fork is extended to support CSS natively and also support SCSS syntax. Automatic semicolon insertion is supported for JavaScript minification, however automatic curly brace insertion is not yet supported.
    • CSS 和 JavaScript 缩小使用了 JSMin 的重分叉形式。这个 fork 被扩展为原生支持 CSS 并支持 SCSS 语法。JavaScript 缩小支持自动分号插入,但尚不支持自动插入大括号。

    回答by adamJLev

    This worked for me:

    这对我有用:

    http://minify.googlecode.com/git/min/lib/Minify/HTML.php

    http://minify.googlecode.com/git/min/lib/Minify/HTML.php

    It's not an already available online tool, but being a simple PHP include it's easy enough you can just run it yourself.

    它不是一个已经可用的在线工具,但作为一个简单的 PHP 包含它很容易,您可以自己运行它。

    I would not save compressed files though, do this dynamically if you really have to, and it's always a better idea to enable Gzip server compression. I don't know how involved that is in IIS/.Net, but in PHP it's as trivial as adding one line to the global include file

    不过,我不会保存压缩文件,如果确实需要,请动态执行此操作,启用 Gzip 服务器压缩始终是一个更好的主意。我不知道这在 IIS/.Net 中是如何涉及的,但是在 PHP 中它就像在全局包含文件中添加一行一样微不足道

    回答by The Lazy DBA

    CodeProject has a published sample project (http://www.codeproject.com/KB/aspnet/AspNetOptimizer.aspx?fid=1528916&df=90&mpp=25&noise=3&sort=Position&view=Quick&select=2794900) to handle some of the following situations...

    CodeProject 有一个已发布的示例项目 ( http://www.codeproject.com/KB/aspnet/AspNetOptimizer.aspx?fid=1528916&df=90&mpp=25&noise=3&sort=Position&view=Quick&select=2794900) 来处理以下一些情况.. .

    • Combining ScriptResource.axd calls into a single call
    • Compress all client side scripts based on the browser capability including gzip/deflate
    • A ScriptMinifier to remove comments, indentations, and line breaks.
    • An HTML compressor to compress all html markup based on the browser capability including gzip/deflate.
    • And - most importantly - an HTML Minifier to write complete html into single line and minify it at possible level (under construction).
    • 将 ScriptResource.axd 调用合并为一个调用
    • 根据浏览器功能压缩所有客户端脚本,包括 gzip/deflate
    • 用于删除注释、缩进和换行符的 ScriptMinifier。
    • 基于浏览器功能(包括 gzip/deflate)压缩所有 html 标记的 HTML 压缩器。
    • 而且 - 最重要的是 - 一个 HTML Minifier 将完整的 html 写入单行并在可能的级别(正在建设中)将其缩小。

    回答by Andrey Taritsyn

    For Microsoft .NET platform there is a library called the WebMarkupMin, which produces the minification of HTML code.

    对于 Microsoft .NET 平台,有一个名为WebMarkupMin的库,它生成 HTML 代码的缩小。

    In addition, there is a module for integration this library into ASP.NET MVC - WebMarkupMin.Mvc.

    此外,还有一个用于将此库集成到 ASP.NET MVC 的模块 - WebMarkupMin.Mvc

    回答by Andrey Taritsyn

    try http://code.mini-tips.com/html-minifier.html, this is .NET Libary for Html Minifier

    尝试http://code.mini-tips.com/html-minifier.html,这是 Html Minifier 的 .NET Libary

    HtmlCompressor is a small, fast and very easy to use .NET library that minifies given HTML or XML source by removing extra whitespaces, comments and other unneeded characters without breaking the content structure. As a result pages become smaller in size and load faster. A command-line version of the compressor is also available.

    HtmlCompressor 是一个小巧、快速且非常易于使用的 .NET 库,它通过删除额外的空格、注释和其他不需要的字符而不破坏内容结构来缩小给定的 HTML 或 XML 源。结果页面变得更小,加载速度更快。压缩器的命令行版本也可用。