懒加载.

无图不欢

如何判断一个元素是否出现在窗口可视范围（浏览器的上边缘和下边缘之间，肉眼可视）。写一个函数 isVisible实现

`
 `

---

当窗口滚动时，判断一个元素是不是出现在窗口可视范围。每次出现都在控制台打印 true 。用代码实现

`
 $(window) .on('scroll',function(){
 isinwindow($(c))
 function isinwindow($ele) {
 var scrollTop = $(window).scrollTop()
 var winH = $(window).height()
 var offsetTop = $ele.offset().top
 var eleH = $ele.height()
 
 
          if ( offsetTop < scrollTop + eleH  && winH + scrollTop > offsetTop){
              console.log( 'Yeah' )
          } else {
              console.log( 'Oh,No.' )
          }
      }
  })
 
 
`

当窗口滚动时，判断一个元素是不是出现在窗口可视范围。在元素第一次出现时在控制台打印 true，以后再次出现不做任何处理。用代码实现

`
 
 `

---

图片懒加载的原理是什么？

1. 显示器打开一个网页，屏幕上你能看到的就加载显示给你看～
   你看不到的，我就不加载，因为懒～
   懒：
2. 因为可以省大家的流量～
3. 更可以说上为你省流量，你不会想一登录一个网页看下大概就没了几十兆流量吧0.0 （理论上都上第一点）
4. 为公司省钱～（理论上第一点）
5. 因为只加载你所看到的，所以你（用户）体验非常好。在当今4G网络（电脑不提了）..那么加载上很流畅的...

以上个人理解上很重要的，每人都可拥有各自见解，但原理一样即可～

来点官方版本的：
在Web应用程序中，系统的瓶颈常在于系统的响应速度。如果系统响应速度过慢，用户就会出现埋怨情绪，系统的价值也因此会大打折扣。因此，提高系统响应速度，是非常重要的。
Web应用程序做的最多就是和后台数据库交互，而查询数据库是种非常耗时的过程。当数据库里记录过多时，查询优化更显得尤为重要。为了解决这种问题，有人提出了缓存的概念。缓存就是将用户频繁使用的数据放在内存中以便快速访问。在用户执行一次查询操作后，查询的记录会放在缓存中。当用户再次查询时，系统会首先从缓存中读取，如果缓存中没有，再查询数据库。缓存技术在一定程度上提升了系统性能，但是当数据量过大时，缓存就不太合适了。因为内存容量有限，把过多的数据放在内存中，会影响电脑性能。而另一种技术，懒加载可以解决这种问题。