阅读:2378回复:8
加载页面上的全部图片如何设置?描述:当前 图片:页面11.jpg ![]() 描述:下拉 图片:页面12.jpg ![]() 如图,浏览网页,比如产品列表的内容,每次只加载当前显示部分的图片,将页面下拉,才开始加载新的图片,这样每次都会卡一两秒,换了其他的浏览器,就可以持续下载完页面上所有的图片,不管是否当前查看部分,下拉就很流畅 当然,只加载当前查看部分的图片,或许是为了节约带宽,但是现在宽带已经不是瓶颈,那么该如何设置,可以一次就把页面所有图片全部加载? win7 64,FF 50.1.0 |
|
1楼#
发布于:2017-03-18 12:06
|
|
2楼#
发布于:2017-03-18 12:42
京东的页面一直都对火狐不好,相反天猫的页面好像就没这问题
|
|
|
3楼#
发布于:2017-03-18 16:46
yfdyh000:可能很难。开e10s可能会流畅很多。试了一下,确实不会一顿一顿,但是图片仍然不能事先加载 |
|
4楼#
发布于:2017-03-18 16:47
|
|
5楼#
发布于:2017-03-18 17:56
图片事先加载会很消耗带宽和资源。chrome浏览器会不会事先加载。我之前用京东也有出现滚动不流畅,以前京东没问题后来才会这样,判断为京东对ff不友好。至于到底什么问题,我不太了解代码也不清楚,看看其他朋友是否知道吧
|
|
|
6楼#
发布于:2017-03-18 18:08
|
|
7楼#
发布于:2017-03-18 21:39
以 电脑椅 书房家具 家具 列表为例
为了尽可能消除可见区域不同导致的误差 先进入全屏模式 然后加载页面 加载完成后刷新一次 再打开开发者工具 在控制台中执行 document.querySelectorAll('li.gl-item div.p-img img:not([src])').length 这句代码会返回未加载的商品图片(不含 src 属性)总数 于是在 1280*1024 的屏幕上 firefox 50 未加载 chrome 44 未加载 可见 chrome 也没有预先加载 *全部* 图片 只是比 firefox 多了 6 其他数据 每一行 4 个 一页总共 60 个 |
|
|
8楼#
发布于:2017-03-18 23:48
不到一年之前有个帖子
https://www.firefox.net.cn/read-53310 不过现在狗东已经可以全程 https 了 没法继续 privoxy 大法 于是随便写了个油猴脚本 // ==UserScript== // @name fuck jd img lazyload // @namespace * // @match https://list.jd.com/* // @match https://item.jd.com/* // @version 1 // @grant none // ==/UserScript== setTimeout(() => { let hostname = document.location.hostname; if (hostname == 'list.jd.com') { document.querySelectorAll('li.gl-item img[data-lazy-img]').forEach(e => { let src = e.getAttribute('data-lazy-img'); if (src != 'done') { e.setAttribute('src', src); e.setAttribute('data-lazy-img', 'done'); } }); } else if (hostname == 'item.jd.com') { new MutationObserver(mutations => { mutations.forEach(mutation => { mutation.addedNodes.forEach(e => { if (e.querySelector('div.detail-content-item img.ELazy-loading')) { setTimeout(() => { document.querySelectorAll('div.detail-content-item img.ELazy-loading').forEach(img => { img.setAttribute('src', img.getAttribute('data-lazyload')); img.removeAttribute('data-lazyload'); img.classList.remove('ELazy-loading'); }); }, 1000); } }); }); }).observe(document, { childList: true, subtree: true }); } }, 500); 仅针对狗东商品列表和商品详细页面的主图 |
|
|