html 中包含大量脚本标记是否会产生性能问题?

2024-02-18

在 html 文件中包含大量(例如 50 个)脚本标记是否存在任何问题?它是否会导致页面渲染时间出现任何性能问题?

我的页面上有一个部分,用于提取地理位置点并将其放入数组中以在谷歌地图上使用。我可以仅针对地理位置点创建一个单独的查询,但我相信如果我在请求其他内容时将其取出,效率会更高。

<script type="text/javascript">points[{count}] = [{job_latitude},{job_longitude},'{title}'];</script>

当浏览器遇到SCRIPT元素它停止解析和呈现 HTML 并开始解析和解释其内容。那是因为代码SCRIPT元素可能会改变已经解析的 DOM 树。

这就是原因建议放置SCRIPT位于文档底部 http://developer.yahoo.com/performance/rules.html#js_bottom这样整个文档主体就已经被解析了。

所以我宁愿完全请求地理位置(也许您可以在服务器端收集它们并在最后打印它们)。或者,如果您不能或不想这样做,请添加defer属性 http://www.w3.org/TR/html4/interact/scripts.html#adef-defer给你的SCRIPT告诉解析器不要等待脚本的元素。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

html 中包含大量脚本标记是否会产生性能问题? 的相关文章

  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • 使用 Angular 下载具有动态 src 的脚本

    Angular 提供了通过动态名称动态加载模板的方法ng include 该部分中的内联 JS 和 CSS 可以正常加载 但没有一个好的方法来下载带有动态 url 的脚本 我们需要下载脚本 相对于调用它们的 html 部分的路径 即我们有一
  • 在 Wordpress 站点中进行 AJAX 调用时出现问题

    我在使用 Wordpress 站点功能的 AJAX 部分时遇到了一些问题 该功能接受在表单上输入的邮政编码 使用 PHP 函数来查找邮政编码是否引用特定位置并返回到该位置的永久链接 我的第一个问题是关于我构建的表单 现在我的表单操作是空白的
  • 如何抑制窗口鼠标滚轮滚动...?

    我正在开发嵌入页面中的画布应用程序 我有它 因此您可以使用鼠标滚轮放大绘图 但不幸的是 这会滚动页面 因为它是文章的一部分 当我在 dom 元素上滚动鼠标滚轮时 是否可以阻止鼠标滚轮在窗口上滚动 附加鼠标滚轮 不是 Gecko DOMMou
  • 为什么是 javascript:history.go(-1);无法在移动设备上工作?

    首先 一些背景 我有一个向用户呈现搜索页面 html 表单 的应用程序 填写标准并单击 搜索 按钮后 结果将显示在标准部分下方 在结果列表中 您可以通过单击将您带到新页面的链接来查看单个结果的详细信息 在详细信息页面中 我添加了一个 返回结
  • 音频 blob 的 URL.createObjectURL 在 Firefox 中给出 TypeError

    我正在尝试从创建的音频 blob 创建对象 URLgetUserMedia 该代码在 Chrome 中可以运行 但在 Firefox 中存在问题 错误 当我打电话时stopAudioRecorder 它停在audio player src
  • 在requestAnimationFrame中使用clearRect不显示动画

    我正在尝试在 HTML5 画布上做一个简单的 javascript 动画 现在我的画布是分层的 这样当我收到鼠标事件时 背景层不会改变 但带有头像的顶层会移动 如果我使用 requestAnimationFrame 并且不清除屏幕 我会看到
  • 如何将 Google Charts 与 Vue.js 库一起使用?

    我正在尝试使用 Vue js 库使用 Google Charts 制作图表 但我不知道如何添加到 div 这是我尝试做的 这是如何使用普通 javascript 添加图表 这是文档的代码示例 https developers google
  • 表单计算器脚本基本价格未加载 OnLoad

    我的表单中有一个计算器来计算我的下拉选项选择 function select calculate on change calc input type checkbox calculate on click calc function cal
  • Iframe 相对路径挑战

    我有一个页面 在页面内有一个 Iframe 目录如下 Folder1 Folder2 IframeCSS IframeCSS Css iframePage1 html stuff css parentPage1 html 在 iframeP
  • 提交表单并重定向页面

    我在 SO 上看到了很多与此相关的其他问题 但没有一个对我有用 我正在尝试提交POST表单 然后将用户重定向到另一个页面 但我无法同时实现这两种情况 我可以获取重定向或帖子 但不能同时获取两者 这是我现在所拥有的
  • Electron - 为什么在关闭事件时将 BrowserWindow 实例设置为 null

    The 电子文档 https electronjs org docs api browser window 提供以下代码示例来创建新窗口 const BrowserWindow require electron let win new Br
  • HTML 离线应用程序缓存,列出下载的文件

    作为我正在构建的离线 Web 应用程序的加载屏幕的一部分 使用缓存清单 http developer apple com library safari documentation iPhone Conceptual SafariJSData
  • 在 vue.js 中访问数组对象属性

    给定以下数组vue js packageMaps Object packageMap 0 Object Id 16 PackageType flag list ProductCode F BannerBase packageMap 1 Ob
  • 如何在jquery中以相反的顺序迭代元素? [复制]

    这个问题在这里已经有答案了 我是jquery的新手 我想知道如何使用each 在jquery中以相反的顺序迭代表单元素 任何帮助 将不胜感激 尝试这个 input get reverse each function
  • JQuery 图像上传不适用于未来的活动

    我希望我的用户可以通过帖子上传图像 因此 每个回复表单都有一个上传表单 用户可以通过单击上传按钮上传图像 然后单击提交来提交帖子 现在我的上传表单可以上传第一个回复的图像 但第二个回复的上传不起作用 我的提交过程 Ajax 在 php 提交
  • 将 MQTTNet 服务器与 MQTT.js 客户端结合使用

    我已经启动了一个 MQTT 服务器 就像this https github com chkr1011 MQTTnet tree master例子 该代码托管在 ASP Net Core 2 0 应用程序中 但我尝试过控制台应用程序 但没有成
  • 如何在 pg-promise 中设置模式

    我正在搜索的文档pg 承诺 https github com vitaly t pg promise特别是在创建客户端时 但我无法找到设置连接中使用的默认架构的选项 它始终使用public架构 我该如何设置 通常 为数据库或角色设置默认架构
  • 导致回发到与弹出窗口不同的页面

    我有一个主页和一个详细信息页面 详细信息页面是从主页调用的 JavaScript 弹出窗口 当单击详细信息页面上的 保存 按钮时 我希望主页 刷新 是否有一种方法可以调用主页的回发 同时还可以从详细信息页面维护保存回发 Edit 使用win
  • FireFox 中的“contenteditable = true”高度问题

    当有空的时候div with contenteditable true CSS contenteditable true border 1px dashed dedede padding 3px HTML div div 在 IE 和 Ch

随机推荐

  • 尝试执行任何以“rails”开头的命令会产生“无法找到 Gemfile”

    我正在尝试安装新的 Rails 应用程序 我的机器上已经安装了几个 Rails 应用程序 一切都运行良好 rails new app Could not locate Gemfile 然后我想我应该运行一个跟踪来弄清楚发生了什么 因为你不会
  • 如何使用 jquery ajax 获取文件列表

    我想获取文件列表 来自名为uploads 获取文件 php get files php单独工作效果很好 即它正确列出了文件 但我怎样才能得到里面的列表insideT div 我可以包括get files php但我需要使用 jquery a
  • Primefaces上传,如何在高级模式下只允许一次上传

    我想知道是否可以通过使用 primefaces 提前上传模式来限制用户仅上传一个文件 目前我有
  • WPF:当 MVVM 绑定属性更改时激活触发器

    不知怎的 我在这里兜圈子 如果这个问题的答案是显而易见的 请原谅我 我想对视图中 ViewModel 中更改的属性做出反应 当属性 bool 更改时 视图应该启动动画 BeginStoryBoard 实际上 在我的应用程序中 有 4 个这样
  • 如何向 sql 视图添加主键? - 或者将视图链接到 LINQ-2-Entities 的替代方法

    我正在 或尝试 向我的实体对象模型添加一个非常简单的视图 数据库位于 SQL Server 2008 中 我使用 C 在 Net 3 5 SP1 上 该视图有两个字段 color 和 colorcount 分别是 Varchar 50 和
  • jstree中如何回滚无法移动的节点

    我试图弄清楚如何仅回滚未成功移动的文件夹节点 下面的代码是我正在尝试做的事情的示例 当您选择了几个文件夹并将它们移动到另一个文件夹中时 就会出现问题 如果其中一个目录无法移动 我希望能够将其回滚到其原始父目录 很遗憾 jstree roll
  • 在捆绑 NSBundle 中找不到名为“MainStoryBoard”的故事板

    几天前我开始了一个新的应用程序 并开始使用模拟器来测试它 我从一个空项目开始并手动添加故事板 模拟器构建并运行我的应用程序一切正常 但当我尝试构建到我的 iPhone 上时 我收到消息 在捆绑 NSBundle 中找不到名为 MainSto
  • Python 杀死线程

    我正在尝试杀死 python 中的一个线程 异常将是执行此操作的首选方法 因为通过 try except 对优雅地退出线程的 run 方法将允许关闭资源 我试过 Python 有没有办法杀死一个线程 https stackoverflow
  • Inline::Perl5 的列表返回给出项目的计数,而不是列表

    一些简单的 Inline Perl5 代码返回一个列表 但它似乎返回项目的计数而不是实际的列表 更改涉及的项目数量会更改计数 use Inline Perl5 my p5 Inline Perl5 new my perl5 code q t
  • Mathematica:如何防止对 In[-1] 求值?

    当我尝试在 Wolfram 中获取最后一个输入表达式时数学5 2 使用In 1 我得到评估输出 In 1 On In 2 2 In 1 Out 2 4 During evaluation of In 1 In trace In 1 gt I
  • 使用 WebClient 以适当的扩展名保存图像

    我需要从网站检索图像并将其保存到本地文件夹 图像类型有 png jpg 和 gif 我尝试过使用 string url http redsox tcs auckland ac nz CSS CSService svc string save
  • 无法在插件 org.springframework.boot:spring-boot-maven-plugin:1.1.4.RELEASE 中找到目标 '' 在可用目标重新打包中

    我昨天在 eclipse 中运行了一个 spring 应用程序 我有 Windows 7 我今天通过命令提示符运行了它 使用以下命令 mvn spring boot run 这次没有成功 我收到了消息 Could not find goal
  • 如何区分 malloc 字符串和字符串文字?

    有没有一种方法 在纯C中 来区分malloc从字符串文字中提取字符串 而不知道哪个是哪个 严格来说 我试图找到一种方法来检查变量是否是 malloced 字符串 如果是 我将释放它 如果没有 我就放手 当然 我可以向后挖掘代码并确定变量是否
  • 方法到底什么时候会产生副作用?

    正如我一直理解的那样 对程序状态的任何更改 或与 IO 有关的任何事情 都是副作用 更改是发生在全局变量中还是发生在调用该方法的对象的私有字段中并不重要 由此可见 所有不返回任何内容的方法要么根本不执行任何操作 要么有副作用 我的困惑来自于
  • 通过网页发送 Outlook 电子邮件

    我有一个使用 ASP net 和 C 开发的 Web 应用程序 该应用程序在我公司的 Intranet 上运行 由于该应用程序的所有用户无一例外都使用 Microsoft Outlook 因此我希望该应用程序能够在客户端打开 Outlook
  • 垃圾引用和悬空引用有什么区别?

    垃圾引用和悬空引用有什么区别 悬空引用是对不再存在的对象的引用 垃圾是无法通过引用到达的对象 垃圾收集语言中不存在悬空引用 因为对象仅在不再可访问时才会被回收 仅收集垃圾 在某些语言或框架中 您可以使用 弱引用 它可以悬空 因为在收集过程中
  • 如何允许 https 网站上的 iframe 内包含 http 内容

    我将一些 HTML 加载到 iframe 中 但是当引用的文件使用 http 而不是 https 时 出现以下错误 已阻止 current page name 处的页面运行来自 referenced filename 的不安全内容 有什么方
  • JavaScript“未定义”与“void 0”

    到底有什么区别undefined and void 0 哪个是首选 为什么 不同之处在于 某些浏览器允许您覆盖undefined 然而 void anything总是返回真实值不明确的 function undefined undefine
  • 如何将react-hook-form与ant design或material UI一起使用

    我正在尝试使用react hook form库来验证表单 当我使用 ant design 或 Material UI 渲染视图时 它无法正常工作
  • html 中包含大量脚本标记是否会产生性能问题?

    在 html 文件中包含大量 例如 50 个 脚本标记是否存在任何问题 它是否会导致页面渲染时间出现任何性能问题 我的页面上有一个部分 用于提取地理位置点并将其放入数组中以在谷歌地图上使用 我可以仅针对地理位置点创建一个单独的查询 但我相信