javascript - 如何最小化登陆页面的加载时间

标签 javascript jquery html css loading

老实说,我很困惑从哪里开始才能最大限度地减少我正在构建的网站的加载时间 - https://projectrhea.herokuapp.com/ .目前需要大约 9 秒来加载我想尝试的网站,并将其缩短到不到 3 秒。

我已经完成了诊断测试,如图所示 https://www.webpagetest.org/result/171113_T2_851758db144ac117ab4e986a3798b1b5/1/details/#waterfall_view_step1 .

据我所知,加载需要一段时间的主要原因有以下三个。

  • 首先是javascript。

    我只需要少量它来运行网站,但我非常 对如何将我需要的代码与我不需要的代码分开感到困惑 需要。我将它用于横幅以在下方显示多个短语 我宁愿保留的旗帜。

  • 第二部分是我从中绘制的 CSS 文件的剪切量。

    我使用了一个模板来开始这个网站(这是我学习的好方法 如何设计网站)。现在我认为这意味着也有办法 许多 css 和其他文件连接到此着陆页。

  • 第三部分是我的视频文件。

    我很想保留这个 视频,因为我喜欢它适合网站的方式。我会尽量减少 解决上述问题后的文件大小。

这是我第一次实时尝试解决这样的问题,我真的很感激更有经验的编码人员可以为此提供知识。谢谢!

最佳答案

使用以下自动化工具:


  1. 优化图片尺寸和质量。 (上面的自动化工具为您提供优化的图像)
  2. 将您的 CSS 文件放在引导文件的开头,例如 index.html
    • 压缩 CSS 文件(删除格式)
  3. 将您的 JS 文件放在文件的底部。
    • 压缩 JS 文件(去除格式)

关于javascript - 如何最小化登陆页面的加载时间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47259172/

相关文章:

javascript - JQuery - 在 window.location 之后使用 $(document).ready()

javascript - 如何从 JS 中的数组中删除一个子集?

javascript - "somevar >> 0"是什么意思?

javascript - `!@#$%^&*(` 等非字母数字字符是否可以用作有效 ID?

javascript - 仅通过传递属性来修改 JS 对象的属性?

html - 如何强制类忽略样式设置

javascript - Node.js https.get 或 https.request 中的 Kerberos 身份验证

javascript - AngularJS Controller ,DRY 代码的设计模式

javascript - jQuery 时间选择器

javascript - Owl Carousel jquery插件autoHeight : true has no effect