优化文件大小归结为删除不必要的字符以及格式化和优化

adnanhridoy2844

代码以使用不同的语法或速记属性来减少文件中的字符总数。

优化和缩小
CSS 优化和缩小已经存在多年，并成为前端优化的主要内容。在 CSS 优化和缩小方面，像cssnano和clean-css 这样的工具是我最喜欢的工具之一。他们提供了多种自定义选项，以进一步控制代码的优化方式以及支持哪些浏览器。

这些工具的工作方式类似。首先，按照配置中设置的规则 手机号数据库列表 解析和转换未优化的代码。结果是代码使用更少的字符，但仍然保留格式（换行符和空格）。

即使在这个基本示例中，我们也成功地将总体文件大小从 76 字节减少到 55 字节，减少了 23%。根据代码库以及优化工具和配置，CSS 优化和缩小可能会更加有效。

CSS 优化和缩小可以被认为是一个轻松的胜利，因为只需对 CSS 工作流程进行一些调整即可获得显着的回报。这就是为什么缩小应被视为最低限度的性能优化以及项目中所有样式表的要求。

参加关于前端、设计和用户体验的精彩研讨会，包括实用要点、现场会议、视频录制和友好的问答。与布拉德·弗罗斯特、斯蒂芬·沃尔特和其他许多人一起。


在 Smashing 杂志上做广告

可达性和环境

性能和排放融合的另一个领域是可达性领域。有一个常见的误解，认为使网站易于访问需要aria向页面添加属性和 JavaScript，但通常您遗漏的内容比您添加的内容更重要，从而使可访问的网站相对轻量级和高性能。

使用标准元素

MDN Web Docs 有一些关于可访问性的非常好的教程。在“ ：无障碍的良好基础”中，他们介绍了无障碍网站的最佳基础如何在于为内容使用正确的  元素。本文最有趣的部分之一是他们尝试button使用div自定义 JavaScript 重新创建元素的功能。

这显然是一个最小的示例，但我认为将此按钮版本的大小与使用标准  元素的按钮版本进行比较会很有趣。本例中的假按钮示例在未压缩的情况下大约重 1,403 字节，而button带有较少 JavaScript 且无样式的实际按钮重 746 字节。该div按钮在语义上也毫无意义，因此对于拥有屏幕阅读器的人来说使用起来以及机器人解析起来都更加困难。