JavaScript是一种流行的编程语言，通常用于构建交互式web应用程序，这得益于它的易用性和在没有"JavaScript关闭"设置的任何浏览器中运行的能力。该语言易于学习，加速了应用程序的开发。但是，为了避免性能问题，一定要为媒体加载优化JavaScript应用程序。您可以通过采用优化网站图像的技术来做到这一点，比如lazy装载。这个帖子涉及以下主题：什么是JavaScript？为什么JavaScript库被广泛使用？什么是延迟加载？什么是交叉口观察器API？你能简化延迟加载过程吗？如何使用交叉点观察器在JavaScript中延迟加载？你怎么偷懒地加载Cloudinary？什么是JavaScript？JavaScript（JS）是多路径的，即，非常适合于过程式、函数式和面向对象的编程。JS最初只是为客户端设计的，现在越来越多地在服务器端通过框架将JS用作网站和web应用程序的后端，比如节点.js.为什么JavaScript库被广泛使用？为了提高效率，除了在开发后端api时使用库之外，许多JS程序员还利用框架，这些框架为常见的功能和方法提供了方便的快捷方式。框架有助于标准化编程，并能显著提高生产率。JS中框架易于使用的部分原因是它庞大的用户群，它可以与许多工具协同工作。最流行的框架有大量的文档、健壮的社区、关于实现的许多有启发性的对话，以及关于最佳实践的提示和建议。此外，强大的社区支持意味着bug和安全问题往往会很快被发现和修复。什么是延迟加载？延迟加载是延迟web元素初始化的一种做法，例如，您可以阻止页面底部的视频加载，直到观看者单击播放按钮或滚动好了。懒加载可提高web性能，并可帮助您避免以下陷阱：由对内容的多个同步请求创建的页面延迟。由于内容文件较大，加载时间较长。由于网站性能差而导致的用户流失，这在互联网连接缓慢的情况下尤其严重。由加载但未查看的内容造成的带宽浪费。为了避免这些问题，大多数现代浏览器都支持延迟加载。值得注意的是，googlechrome76和更高版本本机支持延迟加载，加载属性允许您延迟加载屏幕外图像，而无需额外的代码。对于延迟加载不起作用的浏览器，通常可以通过库或带有相关API的polyfill来实现。什么是交叉口观察器API？Intersection Observer API是一个内置的浏览器工具，用于通过异步监视元素与查看器的viewport或其他元素的交集来操纵网站和应用程序中的元素。有了这个API，你可以-浏览者滚动页面时，延迟加载内容。实现"无限滚动"，比如Instagram和许多论坛。为收入分析或用户体验研究确定并报告广告的可见性。通过保留任务或动画直到它们与查看器相关，从而减少资源消耗。要使用交叉点观察器，首先创建一个回调，它可以由与指定元素或视口相交的元素触发。通常，交集与元素最近的可滚动祖先。下面的代码显示了一个带有交叉点元素选项的回调。复制到剪贴板让callback=（entries，observer）=>{条目.forEach（输入=>{//每个条目描述一个观察到的交叉点变化//目标元素：// entry.boundingClientRect// 入口相交比// entry.intersectionRect// entry.i接口// 入口.根边界// 入口.目标// 进入时间});};在定义这个交集时，您可以指定重叠，即访问内容的距离。或者，在第一次发生事件（如按钮单击）时触发它。你能简化延迟加载过程吗？您可以使用库简化延迟加载。下面是两个例子。洛扎德.js是一个开源的轻量级库，用于配置图像、iframe、视频和音频的延迟加载。基于交叉口观察器API，洛扎德.js不向项目添加依赖项。您可以使用静态或动态加载元素。到安装洛扎德.js, 类型：复制到剪贴板$npm install—保存lozad或：复制到剪贴板$sharn add洛扎德雅尔·js也是一个开源库，用于配置各种媒体的延迟加载，包括