懒加载

青旅半醒 2022-12-13 00:44 411阅读 0赞

为什么要使用懒加载？

当我们进入到某个页面的时候，会有很多的图片，有些图片可能在下面，当我们点进页面但没有滑动全部展示时，其实下面的图片是没有啥作用的，白加载了，还降低网页的加载速度。那懒加载就是只有滚动到可是区域时才加载当前的图片，也就是说不是一次性加载所有的图片，从而在程度减少服务器的请求和带宽

懒加载的优点：

提高前端性能，图片在需要的时候才加载，减轻服务的负担，提高页面的加载速度，能够减少带宽

实现原理：

图片的加载时由src的值引起的，当对src赋值时浏览器会请求图片资源，基于这个，可以利用html5的自定义属性data-xxx来保存图片的路径，当我们需要加载图片的时候才将data-xxx的值赋值

最后放2个截图，jq的懒加载,跟移动端的下拉请求(分页)

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyOTYzODQx_size_16_color_FFFFFF_t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，411人围观）

还没有评论，来说两句吧...

相关阅读

相关懒加载

<script type="text/javascript"> // 懒加载 // getBoundCl

向右看齐/ 2023年08月17日 15:55/ 0 赞/ 270 阅读

相关懒加载

为什么要使用懒加载？当我们进入到某个页面的时候，会有很多的图片，有些图片可能在下面，当我们点进页面但没有滑动全部展示时，其实下面的图片是没有啥作用的，白加载了，还降低网

青旅半醒/ 2022年12月13日 00:44/ 0 赞/ 412 阅读

相关懒加载(Lazy Loading) - MyBatis懒加载 - Spring懒加载

文章目录懒加载(Lazy Loading) MyBatis中懒加载的使用 Spring中懒加载的使用懒加载(

Dear 丶/ 2022年12月10日 15:53/ 0 赞/ 535 阅读

相关懒加载及预加载

1、懒加载 1.什么是懒加载？懒加载也就是延迟加载。当访问一个页面的时候，先把img元素或是其他元素的背景图片路径替换成一张大小为

叁歲伎倆/ 2022年06月08日 04:40/ 0 赞/ 485 阅读

相关懒加载

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8">

快来打我*/ 2022年05月28日 05:35/ 0 赞/ 535 阅读

相关什么是hibernate懒加载？什么时候用懒加载？为什么要用懒加载？懒加载解决方法

转自：[https://www.cnblogs.com/cornucopia/articles/4541621.html][https_www.cnblogs.com_corn

曾经终败给现在/ 2022年05月20日 07:50/ 0 赞/ 413 阅读

相关懒加载，预加载

-------------------- 一.懒加载 > 1.what: > > 延迟加载，一种很好的优化网页性能方式。可视区域外的东西不会加载，减少服务器的负载

骑猪看日落/ 2022年05月14日 10:14/ 0 赞/ 541 阅读

相关 jQuery延迟加载（懒加载）

简介延迟加载（lazy load）又可称之为懒加载，他是为了避免一些无谓的性能开销而提出来的。所谓延迟加载，就是当真正需要数据的时候，才真正执行数据加载操作。可简单理解为

喜欢ヅ旅行/ 2022年05月09日 16:28/ 0 赞/ 1137 阅读

相关懒加载

懒加载 <template> <view> <scroll-view :scroll-into-view="'ss' + curr

亦凉/ 2021年07月25日 12:19/ 0 赞/ 899 阅读

相关 vue 图片懒加载和懒加载原理

在真实图片得到之前,展示懒加载设置的图片 1、安装 cnpm i vue-lazyload -S 2、main.js

你的名字/ 2021年07月24日 20:08/ 0 赞/ 1016 阅读