将社交媒体的外部 Javascript 加载到网页中的目的 [关闭]

Posted

技术标签:

【中文标题】将社交媒体的外部 Javascript 加载到网页中的目的 [关闭]【英文标题】:The purpose of loading External Javascript of social media into webpages [closed] 【发布时间】:2012-10-16 13:42:49 【问题描述】:

在网页中添加社交媒体资源时,传统方法会导致从其他域加载大量外部JS,仅加载带有品牌图像背景的iframe或锚点。以下可能是网络上传输最多的文件(在http://www.google-analytics.com/ga.js 36.35KB 之后,这对许多人来说是不可避免的)

http://connect.facebook.net/en_US/all.js 181.30KB (59.06KB gzipped)https://platform.twitter.com/widgets.js 75.19KB (24.42KB gzipped)https://apis.google.com/js/plusone.js 16.71KBhttp://assets.pinterest.com/js/pinit.js (嗯,这很小,但仍然不需要连接)

例如,http://connect.facebook.net/en_US/all.js 只做一个 事情:添加一个 iFrame <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Flavishdream&width=292&height=180&colorscheme=light&show_faces=true&border_color&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:180px;" allowtransparency="true"></iframe>

Twitter 和 Google Plus 脚本执行的任务非常相似,只是添加了 页面中的小 html 块。

为什么不只编写那些 iFrame、图像和锚点 HTML 呢?

【问题讨论】:

更适合webmasters.stackexchange.com? 我对您的问题有点困惑,如果您使用这些库中的任何一个来增强您的网站,您将需要加载它们。 @KevinDTimm 我认为这是开发人员应该回答的问题,也许在某些情况下存在 javascript 依赖等... @KevinDTimm 此外,我在网站管理员那里播种了类似的问题,这些问题已迁移到此处或服务器故障 @AntLaC 好的,谢谢,我将编辑问题添加更多细节。 【参考方案1】:

您提到的大多数脚本也在后台跟踪用户行为。此外,在加载 JS 文件时,提供者(例如 Google)可能会更改此类脚本附带的功能。当您只是添加一个静态文件或自己编写所需的 HTML 时,这不会那么容易。

【讨论】:

1+ 用于根据布局的自定义行为。然而,这个页面facebook.com/plugins/… 正好适合静态编写的 iframe,不是吗? @rahmanisback 是的。我想说的是,这么多 JS 的原因不是技术原因;但经济实惠。这一切都是关于用户跟踪和利用您的客户个人数据赚钱的。这就是 Facebook 或 Google 等公司获得资金的方式。我真的不想知道这些脚本还真的做了什么——那会导致隐私噩梦……【参考方案2】:

它不会影响您网站的性能。每个js应该加载多个资源,这不应该影响它们嵌入的站点。

【讨论】:

先生,在35KB的小页面中添加70KB的外部JS是浪费带宽。是的,我担心浏览器和下载时间的性能。不是每个人都能获得高速连接吗? 可能很容易更新最新的 js,例如脚本即服务模型,并且使用此模型也可以轻松解决跨浏览器问题【参考方案3】:

您所指的库不仅仅是添加简单的 iFrame。它们还引用框架内的对象。就性能而言,您将遇到的唯一问题是托管 js 文件的网站是否出现故障。

【讨论】:

我刚刚看到你关于带宽的评论,不幸的是,如果你想使用这些服务,你将不得不考虑 js 库。您也可以将文件的副本下载到本地服务器并自己托管,但要小心,如果他们做出任何更改,您将不得不重新下载它们,但这确实不会有太大改善。 我说,iframe 可以调用任何他们需要的 JS。没有什么不对的。我说的是为什么我们需要 JS 来创建那些元素? 很抱歉您遇到了这个问题,我刚刚打开了 FB js 文件,它所做的不仅仅是创建一个 iframe。此外,js 文件需要在本地客户端上才能附加到 iframe 的内容。另一件事,无论 iframe 确实会影响您的带宽。 您仍然没有得到问题,先生。你会打开这个页面吗?它在任何浏览器中看起来和行为都很好吗?我可以将其定位为 iFrame。那是我的问题。 facebook.com/plugins/… 即使您将其放入 iframe 中,您仍在加载 6 个其他 js 文件,并且您仍将使用该带宽来加载它们。【参考方案4】:

首先,任何 Javascript 都是客户端应用程序,因此您不必担心布局这些组件所需的性能。 其次,这些文件非常小,因此流量可以忽略不计,即使 iFrame 是 HTML 格式,您也需要某种连接来获取它,对吗?因为显然你不能只在代码中静态地放置喜欢按钮(出于可维护性的原因)

【讨论】:

在一个35KB的小页面中添加70KB的外部JS是浪费带宽。是的,我担心浏览器和下载时间的性能。不是每个人都能获得高速连接。

以上是关于将社交媒体的外部 Javascript 加载到网页中的目的 [关闭]的主要内容,如果未能解决你的问题,请参考以下文章

如何将外部网页加载到 html 页面的 div 中

干货20个精心挑选的前端开发工具

将社交媒体网络共享按钮集成到 Highcharts。 [关闭]

尝试将社交媒体链接添加到 Drupal 网站

javascript 分享社交媒体

如何用python 爬虫在社交媒体上抓取评论