我试图让我的前端设计过程更加模块化,并且正在探索webpack。 它支持一个样式加载器,它允许导入一个css文件并将其注入到文档中,如下所示:
require("style/url!file!./file.css");
// => add a <link rel="stylesheet"> to file.css to document
但是,我主要关注的是网站而不是webapps1,因此通过javascript添加CSS会让人觉得奇怪。 但我可能只是老式的,所以我想知道:加载程序意味着是用于所有的CSS,还是它只是意味着加载小的,条件部分的CSS?
如果它可以用于加载所有的CSS,使用webpack生成的bundle.js
注入CSS而不是直接链接CSS中的CSS文件会有任何处罚? 除了它显然打破,如果JavaScript没有启用?
发布于 2018-03-13 16:03:38
尽可能将CSS包含在HTML中。 现在的浏览器会在页面解析时开始提取CSS,有时甚至在JavaScript开始下载之前。 你将会在页面渲染速度方面获得改进,在加载器之外完成主要部分。
另外,如果你坚持一种主要的“核心”风格,你可以从缓存中受益,这将会再次加载比JavaScript更快的速度。
http://csswizardry.com/2013/01/front-end-performance-for-web-designers-and-front-end-developers/
在你的例子中,我通过将它分成多个部分并使用装载器和捆绑器来完成我在页面中加载的特定元素。 应用程序的外观和感觉,品牌等从标记中加载,并且控制我的特定UI(比如,特定表单的布局)的行为是使用捆绑器或打包器完成的。
https://stackoverflow.com/questions/-100007597
复制相似问题