tl;dr: 在你的Facebook社交插件中添加data-lazy="true" ，这些插件位于折叠下方，并获得好处。
在代码中：
// before
<div
class="fb-like"
data-href="https://phpied.com"></div>
// after
<div
class="fb-like"
data-href="https://phpied.com"
data-lazy="true"></div>
目前，你的访客即使在页面下方也会加载Facebook的iframe内容，而在你实施懒惰加载后，他们只会在有机会看到这些iframe时才会加载。寻找like.php请求和它的依赖性。
这些插件是如何工作的？
Facebook的社交插件是你可以嵌入到你的页面中的Facebook内容。喜欢按钮、分享按钮、评论、嵌入式视频、帖子和照片等等。
这些插件是指向例如facebook.com/plugins/like.php 、facebook.com/plugins/comments.php 等的iframe。有些插件允许你自己创建iframes，而其他插件则不允许。而一般来说，最好不要这样做。为什么？因为内容可能因语言和其他因素而不同，如果你自己创建iframe，就会有内容被切断的风险。
那么，谁来编写iframe呢？FB的JSSDK。你加载SDK（当然是异步的），并在你希望插件出现的地方撒上divs 。SDK根据需要写入并调整iframe的大小。
有什么新功能？
浏览器现在支持iframes的本地懒惰加载。
Facebook现在支持所有社交插件的本机懒惰加载。
你所要做的就是给你的插件的div元素添加data-lazy="true" 属性。
为什么只在折叠下面
快速回答：否则你的访问者可能会看到一些内容的转移。
长答案：为了根据内容以最佳方式调整插件的大小，FB JSSDK最初创建的插件有visibility: hidden ，大小为1000x1000像素。iframe本身在一个0x0的容器内。在iframe加载后，它通知SDK它的大小，SDK调整iframe的大小并使其可见。
在这种情况下，visibility: hidden ，防止Chrome浏览器的本地懒惰加载。理由是：即使开发者设置了iframe loading="lazy" ，分析功能也不应该懒惰加载。这是一个值得商榷的决定，但目前是这样的。
因此，为了支持目前实现的本地懒惰加载，FB JSSDK在1x1容器内创建了一个可见的iframe（原来0x0容器也会在Chrome中阻止本地懒惰加载）。因此，如果内容在折叠上方，1x1容器内的1000x1000的iframe可能会导致一些可见内容移动或与其他内容重叠，即使在1x1之外不可见。
如果你的插件只在折页下方可见（最常见），Chrome的积极（或 "安全 "是正确的词吗？
为什么我在一个随机的博客上读到这个？
这应该是在 developers.facebook.com 上，不是吗？对。然而两周前是我在Facebook的最后一天。在我最后一个星期一的前一个星期天，我在Chrome的朋友Addy和Dominic的帮助下进行了调试，并设法在星期天发送了差异，星期一得到了批准，登陆（谢谢Brad！），几乎没有时间更新文档。没有时间进行正式宣布。
让网络更快
轮到你了!去你的插件实现，在折叠下面为所有插件添加data-lazy="true" 。评论、嵌入、文章末尾的喜欢/分享按钮等等。
你的用户会因此而喜欢你的!电池寿命和数据允许量将被节省,网络将不那么拥挤。
