gpt4 book ai didi

css - 哪种结合CSS技术?

转载 作者:行者123 更新时间:2023-11-28 11:50:54 26 4
gpt4 key购买 nike

在为 CSS 组合文件时,您认为以下哪项是最佳方式:

假设我有一个 master.css 文件,用于我网站上的所有页面(page1.aspx、page2.aspx)

Page1.aspx - 具有一些仅在该页面上使用过的独特 css 的特定页面,因此我创建了一个 page1.css 并且它还使用了另一个 css grids.css

Page2.aspx - 另一个不同于网站上所有其他页面且不同于 page1.aspx 的特定页面,我将其命名为 page2.aspx 并制作一个 page2.css不使用 grids.css

那么你会把脚本组合成:

选项 1:

Combine scripts csshandler.axd?d=master.css,page1.css,grids.css when visiting page1
Combine scripts csshandler.axd?d=master.css,page2.css when visiting page2

好处:特定于页面,渲染更快,因为只有该页面的选择器需要匹配,没有未使用的选择器

缺点:master.css + 特定页面的多种组合,因此必须为每个页面下载 master.css

选项 2:

合并所有脚本,无论页面是否需要它们

csshandler.axd?d=master.css,page1.css,page2.css,grids.css (master, page1 and page2)

这样它就被缓存为一个。问题是渲染速度可能会变慢,因为它必须尝试将 css 中的每个选择器与页面上的选择器匹配,即使是丢失的选择器,所以在不使用 grids.css 的 page2.aspx 的情况下,网格中的选择器.css 将需要被解析以查看它们是否在 page2 中,这意味着渲染会很慢

优点:无论您访问哪个页面,都将永远下载和缓存一个文件

缺点:未使用的选择器将需要被浏览器解析较慢的渲染

选项 3:

单独保留主文件,仅结合其他脚本(这样做的好处是因为所有页面都使用主文件,因此有可能缓存它,因此不需要继续下载

csshandler.axd?d=Master.css
csshandler.axd?d=page1.css,grids.css

好处:无论您访问什么页面,master.css 文件都可以被缓存。没有多少未使用的选择器,因为应用了特定页面

缺点:最初必须至少发出 2 个 HTTP 请求

大家怎么看?

干杯

点网影子

最佳答案

我个人会说选项 2 - 合并所有脚本。随着网站的增长,页面数量也会增加,跟踪哪些 CSS 文件与哪些文件一起使用将变得难以管理。您可能认为某些 CSS 仅在一个页面上使用,但我敢打赌,将来情况并非如此。

一旦用户访问了一个页面,他们将拥有所有 CSS,而其他页面将快得多。 (虽然您可能想单独优化您的主页)。考虑网络应用程序,而不是网页页面

关于css - 哪种结合CSS技术?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2666403/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com