lazyload

Lazyload是通过延迟加载来实现按需加载，达到节省资源，加快浏览速度的目的。 网上也有不少类似的效果，这个Lazyload主要特点是： 支持使用window（窗口）或元素作为容器对象； 对静态（位置大小不变）元素做了大量的优化； 支持垂直、水平或同时两个方向的延迟。 由于内容比较多，下一篇再介绍 图片延迟加载效果 。 兼容：ie6/7/8, firefox 3.5.5, opera 10.10, safari 4.0.4, chrome 3.0 效果预览 //--> */ /*--> */ 模式： 垂直正交方向 水平正交方向 垂直方向 水平方向 动态加载 阈值： //--> */ /*--> */ 利用textarea加载数据： <strong><a href="http://www.cnblogs.com/cloudgamer/archive/2008/07/06/SlideTrans.html">图片滑动切换效果</a></strong> <strong><a href="http://www.cnblogs.com/cloudgamer/archive/2008/07/21/ImgCropper.html">图片切割效果</a></strong> <strong><a href="http://www.cnblogs.com/cloudgamer/archive/2008

最近写公司的项目的时候遇到一个关于图片加载的问题，所做的页面是一个商城的商品列表页，其中需要显示商品图片，名称等信息，因为商品列表可能会很长，所以其中图片需要滑到可以显示的区域再进行加载。 首先我的图片加载插件使用的是jquery的lazyload， **一般情况下：** 使用lazyload，只需要引入相关文件（当然jquery也要提前引入） <script src="../js/jquery.lazyload.js"></script> 然后在HTML的img标签中加入类名：lazy，图片的地址使用：data-original = “XXXXXXXXX”，最后再js中加上 $(function(){ $("img.lazy").lazyload({ effect: "fadeIn", container: $("#lazycontainer") }); }) 这里设置了图片加载进来显示是渐现的效果，以及包裹整个商品列表的容器container 来源： https://www.cnblogs.com/baimeishaoxia/p/12215711.html

什么是单例? 一个类仅有一个实例 解决了全局使用的类频繁的创建与销毁 饿汉式 public class SingletonOne { // 私有化构造方法 private SingletonOne ( ) { } ; // 性能不高 在程序启动的时候 就创建好了对象 对象一直在内存中 // 线程是安全的 public static final SingletonOne hungry = new SingletonOne ( ) ; public static SingletonOne getHungry ( ) { return hungry ; } } 测试 public class Test { public static void main ( String [ ] args ) throws IOException , ClassNotFoundException { // 200 个线程并发访问 int count = 200 ; CountDownLatch latch = new CountDownLatch ( count ) ; for ( int i = 0 ; i < count ; i ++ ) { new Thread ( ) { @Override public void run ( ) { Object register = SingletonOne

hibernate中的 延迟加载(lazyload)分 属性的延迟加载 和 关系的延迟加载 属性的延迟加载: 　　　　当使用 load的方式来获取对象的时候，只有访问了这个对象的属性，hibernate才会到数据库中进行查询。否则不会访问数据库 Load的加载方式： 1、Load采用延迟加载的方式，hibernate的思想是既然这个方法支持延迟加载，它就认为这个对象一定在数据库中存在，可以放心的使用代理来延迟加载，如果在使用过程中出现了问题就放心的抛异常 2、Load方法会首先查询session缓存，看缓存中有没有这个对象 3、如果缓存中没有这个对象就会去创建个代理对象来管理，因为延迟加载需要代理来执行。但是并没有去数据库中查询 4、只有当你实际使用这个对象的时候，它才会触发sql语句。这个时候hibernate就会去查询二级缓存和数据库，如果数据库中没有这条语句，就抛出异常ObjectNotFoundException。 hibernate load方法加载实体对象的时候，会根据映射文件上 类级别 lazy属性值的配置 ，分情况讨论： （1）若为true，即为延迟加载，就是上面的模式 （2）若为false，即为非延迟加载，即立即加载。就跟get方法查找顺序一样，只是最终若没发现符合条件的记录，则会抛出一个ObjectNotFoundException。 关系的延迟加载： 　　　

图片懒加载 为了避免页面一次性向服务器发送大量请求而造成页面阻塞，我们需要控制请求数量，按照我们需要的量去加载图片。 懒加载的优点 提高前端性能，按需加载图片减轻服务器负担，提高页面加载速度。 懒加载的原理 图片的加载是依赖于 src 路径，我们可以设置一个暂存器，把图片路劲放到暂存器中，当我们需要这个图片加载显示时，再把路径赋值给 src ，这样就能实现按需加载，也就是懒加载。我们通常使用html5中的 data- 属性作为暂存器，例如 src 的值默认是正在加载中的GIF，而真正的图片路径是保存在 data- 中。 懒加载的实现 现在很多优秀的插件都能够实现懒加载的功能，但是不管方法如何，实现原理都是一样的。 JQuery （不使用插件） 使用懒加载时，我们的 src 的值默认是”正在加载中“的GIF， data-lazyload 是自定义属性，用于存放图片真实路径。如下面的代码。 <img src="loading.gif" data-lazyload="img.jpg"> 我们首先要知道什么时候应该加载图片，什么时候不需要加载？ 对于用户来说，看得到的地方才需要加载，看不到的地方加载了也是白白浪费资源。所以我们知道，在 可视区域中，我们才需要加载图片 。 如何判断图片是否在可是区域？我们可以利用元素的偏移高度，对比设备宽度加上滚动条高度来判断该元素是否处于可视区域中。

一般vue项目完成打包以后需要优化，特别是首次打开加载速度们，webpack打包以后js文件体积很大等方法，可以用这个方法来压缩js文件 安装node.js 安装当前应用 -- uglifyjs 如何安装node.js就不再介绍了, 百度一下一大把.安装uglifyjs如下: uglifyjs压缩JS文件 ====== 演示如何使用uglifyjs压缩JS 打开一个用于存放JS文件的文件夹,文件目录如下图: 准备压缩lazyLoad.js做实验, 当前该文件的大小为10KB.我们来进行压缩,看看压缩后的文件大小是多少? 这里给大家介绍一个小技巧, 以方便快速地打开cmd, 并定位到当前目录. 点击"在此处打开命令窗口"后即可以进入到cmd, 你会发现已经切换到当前文件所在的路径了. 此时输入命令对lazyLoad.js文件进行压缩并输出文件名为lazyLoady.min.js的文件: uglifyjs lazyLoad.js -o lazyLoad.min.js 也可以运行如下代码, 测试一下 -m 参数: uglifyjs lazyLoad.js -m -o lazyLoad.min.js 以看到, 压缩后只有3KB, 相比之前的, 文件缩小了3倍多.快去试下吧! 结束语 ====== 对于自己来说, 本文就相当于做笔记. 需要注意的是, uglifyjs只能压缩js文件

1.引用<script src="http://a.tbcdn.cn/apps/baron/js/??lib/tmm/tmm.js,lib/lazyload/lazyload.js?20121015"></script> 2.对于要懒加载的图片进行如下属性设置。<img src="http://a.tbcdn.cn/mw/webapp/fav/img/grey.gif" dataimg="http://img03.taobaocdn.com/tps/i3/T1xl4_FlFaXXcLmU_5-305-317.png" /> 其中src为未加载时的图片，dataimg为实际要加载的图片。 3.执行lazyload.init(); 4.分tab的懒加载。判断tab把下面的图片有没加载过。根据loaded属性判断，还要对非当前tab所属的图片进行class lazy去掉。对已加载的loaded为true的图片，不加lazy属性 5.注意lazyload.init()的执行时机，如果在dom ready阶段执行，会下载所有图片，不能实现懒加载。要在winow.onload完成这个阶段去执行。 lazyload.js代码解读： /** * 基于jQuery或者zeptoJS的惰性加载 */ var lazyload = { init : function(opt){ var that =

Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的. 在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服务器负担. 如何使用 Lazy Load 依赖于 jQuery. 请将下列代码加入HTML的结尾，也就是 </body> 前: 1 2 < script type = "text/javascript" src = "jquery.js" ></ script > < script type = "text/javascript" src = "jquery.lazyload.js" ></ script > 你必须改变图片的标签。图像的地址必须放在 data-original 属性上。给懒加载图像一个特定的class（例如:lazy）。这样你可以很容易地进行图像插件捆绑。代码如下： 1 < img class = "lazy" alt = "" width = "640" height = "480" data-original = "img/example.jpg" /> 1 2 3 $( function () { $