外链样式优于内嵌样式的加载性能

为什么外链样式优于内嵌样式？

当我们在编写网页时，经常会使用CSS样式来美化页面。在使用CSS时，有两种方式可以将样式应用到HTML元素上：一种是内嵌样式，即将CSS代码写在HTML的style标签中；另一种是外链样式，即将CSS代码写在外部样式表中并通过链接引入HTML。那么，为什么外链样式优于内嵌样式呢？

外链样式的加载方式

外链样式的加载方式是在HTML文件中通过link标签引入外部CSS文件，浏览器会在下载HTML文件后再去下载CSS文件。这种方式可以让浏览器在下载HTML文件时不会被CSS文件阻塞，从而提高了页面的加载速度。

内嵌样式的加载方式

与外链样式不同，内嵌样式的加载方式是在HTML文件中直接写CSS代码，当浏览器解析HTML文件时，会同时解析CSS代码。这种方式会让浏览器在下载HTML文件时同时下载CSS代码，从而降低了页面的加载速度。

外链样式的缓存机制

外链样式的另一个优点是可以被浏览器缓存，而内嵌样式则无法被缓存。当使用外链样式时，浏览器会将CSS文件缓存在本地，当下次访问同样的页面时，浏览器会直接从本地缓存中读取CSS文件，从而提高了页面的加载速度。

内嵌样式的使用场景

虽然外链样式优于内嵌样式，但在某些情况下，内嵌样式也是必须的。比如，在编写邮件、Word文档等富文本编辑器时，由于无法引入外部CSS文件，只能使用内嵌样式来调整文本的样式。

结论

总的来说，外链样式优于内嵌样式的加载性能，可以提高页面的加载速度。因此，在编写网页时，我们应该尽量使用外链样式，同时合理使用内嵌样式。