我的Bootstrap网站需要花费很多时间来加载。我使用了Envato的Celia模板来构建它

Question

我从Envato Element购买了Celia模板，并编辑了大多数代码。我在Github上托管了我的网站：https://github.com/rosyhnguyen/rosyhnguyen.github.io。我使用了Namecheap的域名：https://rosyhnguyen.me

我的网站不包含任何视频或媒体文件，但是需要花费[[大量的时间]（加载案例研究页面将近5-10秒）。

您能帮我解决我的设置问题吗？我所有的设置都在上面的GitHub链接中。 The site takes a lot of time to load

Answer 1

据我从您的网站上看到的，您的模板正在加载大量非常繁琐的外部资产和javascript脚本（例如，革命性滑块）。

如果您想对网站上发生的事情有个很好的了解，应该检查Chrome开发者工具上的“网络”标签瀑布。

据我所知，有一个资源叫做：'sketchslider-2.png'，另一个资源也是16mb。这正在削弱您的表现。网站上的图片大小应尽可能减少，并使用CSS和Javascript的缩小版本。

也尝试在您的代码中查找一些缺少的资源，因为我也看到了一些404。

例如，可以使用图像缩小器工具（例如https://tinypng.com/）或Photoshop减小图像的大小。

Network waterfall

Answer 2

检查Chrome中的网络标签。

sketchslider2.png几乎为15 mb，图像大小为7001 x 3842

fitcheck.png为4.5 mb，大小为8168 x 4000

除非您计划将您的网站投影到宽屏电视，否则不需要这些大小。

需要在1920 x 1080范围内优化大型图像。