我的问题是，有没有办法首先让网站显示，然后使用JavaScript加载那些繁重的资源，同时保留JavaScript不可用的功能？
我的理由：我正在尝试优化我的Joomla模板。可能会有一些非常沉重的资源，如超大背景图像。我的测试用例包含4000px * 3000px 3.01MB .png图片。虽然SO向我展示了this解决方案，但由于我计划使用背景图像，即使没有JavaScript，我也无法使用它。另外我自己想出来......
如果有人可以证明几乎所有的互联网用户都使用JavaScript，这会让事情变得容易多了......我说的是99.999％。
无论如何，这会对网站显示之前的总时间产生一些影响。还有另一种资源，我想使用这种技术，这是一个由Joomla插件运行的PHP脚本，需要1秒钟才能响应，也会影响总时间。
最终，我想控制何时加载特定资源。
我自己的尝试：我想删除相关元素的background-image样式，但我的时间轴仍未改变。它渲染速度更快，因为浏览器的工作量较少，但仍然会加载图片。
答案 0 :(得分：1)
我想你应该重新考虑你的情况。你为什么要首先在网站上加载这么重的图像？那些拥有昂贵数据计划的移动用户呢？你确定他们想要花4mb购买4k图像吗？
也许不是。
相反，您是否尝试针对网络优化图片？像photoshop这样的软件提供了这样的选择。自适应图像作为响应式设计的一部分呢？ （粉碎杂志不久前有一篇很好的文章http://coding.smashingmagazine.com/2013/06/02/clown-car-technique-solving-for-adaptive-images-in-responsive-web-design/）
但是，如果你坚持，有一些javascript库可以帮助你。我想到的第一个是后弯（http://srobbin.com/jquery-plugins/backstretch/）。它将在背景中显示默认颜色，直到您的图像加载，然后交换它们。
答案 1 :(得分：0)
如果您使用Modernizr之类的JS在<html>标记上添加一个类（它为.no-js交换.js，那么您可以有选择地为浏览器添加图片没有启用JS。
然后你可以愉快地创建一个新的Image对象，加载它并在它准备好时更改元素样式。