defer和async的区别？

一、script是同步的

        在html中，<script>标签默认是同步自上而下解析和渲染页面，也就是说它是阻塞的，这可能会导致页面加载速度变慢，特别是如果脚本很大或者依赖外部资源的加载。

        为了解决这个问题可以使用async和defer属性。

二、async和defer

1、async:

        当你在script标签添加async属性时，脚本将异步执行。它会在页面继续解析的同时加载，并在加载完后立即执行。但是，异步脚本的执行顺序不能保证，因为它们可能任意顺序完成。

<script async src="example"></script>

2、defer

        使用defer属性时，脚本也会异步执行，但是它会保证它们在文档中的顺序执行。页面解析不会被阻塞，脚本会在文档解析完成后执行。

<script defer src="example"></script>

三、总结

        选择 async 还是 defer 取决于你的需求。如果脚本之间没有依赖关系，并且它们的执行顺序不重要，那么可以使用 async。如果你希望按照它们在文档中的顺序执行，而不阻塞页面解析，那么可以使用 defer。