Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
629 views
in Technique[技术] by (71.8m points)

javascript - 样式化的组件最终样式将直接通过DOM注入 <styles /> 标签和样式标签注入会影响性能吗?(styled components final styles are injected directly in DOM with <styles /> tag, with style tag injection does performance gets affected?)

The reason for asking this question was to understand performance impact of styled components , So as I have noticed and this is my opinion , that as styled components inject styles in DOM directly via tag ,and does not affect performance that much because even though CSS is written in JavaScript which increases bundle size but that does not matter anyways because browser caches the javascript file and only first time it would affect when file is downloaded , and if not CSS in JS then styles/css file would take that size instead of js file Only issue could be processing of injecting styles in DOM , but somewhere you have to compromise to gain some benefits because its also a JS library like others(提出这个问题的原因是为了了解样式化组件的性能影响,因此,正如我所注意到的,这是我的观点,即当样式化组件通过标记直接在DOM中注入样式时,它不会对性能产生太大影响,因为即使CSS是用JavaScript编写,可以增加包的大小,但这没关系,因为浏览器会缓存javascript文件,并且只有在第一次时才会影响下载文件的时间,如果不是JS中的CSS,那么styles / css文件将采用该大小而不是js文件唯一的问题可能是在DOM中处理注入样式,但是您必须在某个地方妥协以获取一些好处,因为它也像其他JS库一样)

Also with code splitting bundle size divides,(同样,通过代码拆分包大小划分,)   ask by Vaibhav Mittal translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

You can find this information in the documentation :(您可以在文档中找到以下信息:)

... styled-components injects its styles during runtime at the end of the <head> by default.(...默认情况下,styled-components在运行时在<head>末尾注入其样式。)

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

1.4m articles

1.4m replys

5 comments

57.0k users

...