以编程方式生成的 HTML 中的样式表和 body 和 head 标签

Question

我正在使用 Scala 生成 HTTP、HTML 和 CSS。我也打算使用 Scala 来生成 Javascript，但我还没有到那个阶段。

使用单独的样式表有什么好处？ CSS 提供了一种多重继承形式，您可以通过它来组织标记的样式。然而，Scala 已经拥有自己的多重继承系统，而其他函数式语言也提供了自己强大的问题分解和声明式组合方法。在生成单独的样式表的同时，增加了算法的复杂性并阻碍了可理解的干净代码的生成。

单独的样式表声称的优点之一是它们使用的带宽更少。然而，我很难相信 CSS 与图像相比使用了显着的带宽，更不用说视频了。那么单独的样式表是否会给搜索引擎排名和站点分类带来优势？它们是加快还是减慢渲染和布局？它们是否有助于可访问性和用户定义的样式？如果不是在 2.0 中，我会认为不使用单独的样式表实际上可能会加速 HTTP 1.1 中的交付

与 Head 和 Body 节点 /Tags 类似。它们是否有任何优势来证明以编程方式生成它们所增加的复杂性？它们似乎对浏览器生成的内容没有任何功能差异。

那么问题是，单独的样式表以及 Body 和 Head 节点对于生成最佳网站有多重要？可以将 CSS 放入 HTML 叶节点吗？

Answer 1

使用单独样式表的优点：

• 可缓存性：无需一遍又一遍地重新加载相同的样式
• 较小的尺寸：即使使用 gzip 压缩，400 个div 标签的所有样式都将比没有内联样式的页面在每页上的网络字节数更多。
• 可能性：某些 CSS 无法以内联样式表示。例如，任何伪元素或状态选择器（:hover、:focus 等）
• DRY：如果您在编译时构建样式树以在编译时应用于 HTML 树，则不适用。

缺点：

• 速度：内联样式的渲染速度会更快，因为当浏览器解析标签时，它知道应用了哪些样式。
• 局部性：内联样式使您可以轻松查看元素的外观（浏览器调试工具对此有争议）

html / head / body - 我需要它们吗？

general consensus seems to be "yes"，主要是因为如果你不包含它们，你更有可能遇到晦涩的浏览器错误（因为“如何选择什么来制作哪个元素的子元素”算法不是很明显，一些极端情况对开发人员来说不一定很明显）。