淘宝图片处理讨论
淘宝网页面很大，但是打开速度很快。其对图片处理是运用了滚动加载，就是滚动轴滚到哪里，图片在哪里加载。但是你想查看他的源代码，那要费九牛二虎之力吧，因为他们代码压缩合并做的很好！因为图片是滚动加载的，初始化的时候图片不加载，那么当你在页面底部刷新页面的时候，底部的页面通常不会加载出来，淘宝网的做法貌似是（因为我没有看他们的源代码，只是凭操作），刷新让页面回到顶部。
模仿淘宝，做滚动图片加载
我不知道淘宝网是如何做滚动加载的，但是我之前有篇文章，介绍了滚动加载，有兴趣的朋友可以去看下： https://www.haorooms.com/post/js_jquery_lazyload_viewload
假如你想做成淘宝那样，你可以改进一下代码。
其实延迟加载的思路就是先把图片放在一个data-src或者一个属性中，当页面滑动到可视区域内时，把存起来的图片地址赋值给src就可以了。
这里我就不罗列代码了。
刷新回顶部
当我们做了可视区域加载的时候，通常让其刷新回到顶部。像淘宝那样。刷新回顶部。
我不知道淘宝网是如何做的。刷新回顶部，我用到的是onbeforeunload 事件。
关于onbeforeunload 事件，https://www.haorooms.com/post/js_close_llq ，这里我也有篇文章专门介绍。大家可以看下。刷新回顶部就是用这个事件，可以这么写。
window.onbeforeunload = function(){$(window).scrollTop(0);}当网站所有的图片都用了可是区域加载，css和js都合并压缩了，那我们的网站速度和性能会提升很多！
假如你知道淘宝网的做法，或者其他更好的做法，欢迎留言交流！
2021年12月补充-history.scrollRestoration
利用这个history.scrollRestoration 可以做到刷新页面回顶部。不用在用上面的方案了。
使用很简单，在页面要刷新回顶部的页面执行下面的js代码就可以了。可以初始化执行，也可以在某个时机下面执行：
if (history.scrollRestoration) {
history.scrollRestoration = 'manual';
}history.scrollRestoration 支持下面两个属性值：
auto
默认值，表示滚动位置会被存储。
manual
单词的意思就是手动。表示，滚动的位置不会被存储。兼容性很不错，现代浏览器很早就支持了，移动端放心使用。目前应该只有ie不支持。