懒加载

（一）可选项： （二）懒加载： 在 OC 开发中，懒加载一般自定义控件。在 S wift中，懒加载还是需要用的，可以保证控件延迟创建，还能避免处理控件解包。如果直接定义控件v ar label = UILabel ，根据代码从上到下，会让控件在 V iewDidLad之前就提前创建了。所以需要懒加载。 OC 中懒加载就是 G et方法， S wift直接lazy var 。当然也可以private lazy var来限定作用域。 （ 1 ）简单的懒加载： 　　（ 2 ）完整的懒加载：（）就是函数执行，就是一个特殊的闭包，所以懒加载本质是一个闭包。一般不这么写。 　　 （ 3 ） OC 和 S wift 区别 *OC ： 　　　　 　　　　OC 是等于 nil 时候就懒加载 　　　　 　　 　　当 label 设 nil 的时候就在此调用。在ios 6 中，didReceiveMemoryWarning是不清理视图的。 　　 此时释放的时候就会报错。因为定义的时候没有？，就是一定有值得。 那么如果定义时候加？ 一旦label = nil ，也不会在执行懒加载了！因为懒加载根本没写如果是空就创建。 懒加载只会在第一次调用的时候执行闭包。 S wift 中一定注意不要主动清理视图或控件，因为懒加载不会创建了（例如内存警告别干掉控件，干掉了在也用不成了，因为懒加载就一次） （三）计算型属性

图片应做成响应式、(大尺寸图片建议)使用 渐进式JPEG 、使用 mozJPEG ， tinyPNG 等工具对图片进行压缩; 压缩工具： http://c7sky.com/kraken-io-image-optimizer.html 这里主要讲类似于bannner等大图优化加载问题； 压缩工具： 　　 - TinyPNG 和 JPEGmini 这样的工具可以帮助压缩和优化图片。 　　http://www.tuhaokuai.com -首先看html中主要用的是<img src="">还是{background-image:url()}; 如果是第一种： 　　我会选择用懒加载来处理图片； <script type="text/javascript" src="js/lazy_min.js"></script><script> $(function(){ //懒加载 $("img.lazy").lazyload({ effect : "fadeIn", skip_invisible : false,// Lazy Load 默认忽略了隐藏图片. 如果你想要加载隐藏图片, 请将 skip_invisible 设为 false threshold : 200,// 设置 threshold 为 200 令图片在距离屏幕 200 像素时提前加载 failure_limit : 10/

1. 发现两个问题 说是两个问题, 但我不知道算不算是问题, 至少我感觉这影响到了用户体验. 1.1 问题1 我测试时候发现, 当界面正在展示进度条, 这时候弹出了键盘, 进度展示控件会自动上移一段距离, 键盘隐藏, 进度展示会恢复到原来的位置. 但是, 在键盘显示, 进度圈上移之后, 应用程序进入后台, 再回到前台时候, 进度展示圈的位置在上移之前的位置. 如下所示: 分析 当然, 想当然的分析肯定是不行的, 必须去阅读相关的代码才能找到问题所在. 通过查阅源码发现, sv中所有的更改位置的代码都是通过 positionHUD: 这个方法来实现了, 在弹出键盘隐藏键盘, 应用成为活跃状态等等的通知都走这个方法. 这个方法比较长, 因为作者考虑到了各种应用场景, 各种可能会出现的情况. 此方法的功能实现思路大概是: 算出键盘的高度, 根据键盘高度算出HUD位置, 最后重置HUD位置. 出现如上提出的问题, 肯定是在应用从后台进入前台时候键盘高度没有计算好, 在源码的 Get keyboardHeight in regards to current state 这块代码中, 作者并没有对从后台进入前台时候进行特殊处理, 读取的还是键盘隐藏或者显示出来时候的通知, 如图: 为了解决这个问题, 我的处理方法就是对从后台进入前台时候进行特殊处理, 主动获取键盘的高度, 并计算出HUD的位置

CSSSprite 减少对服务器请求 SVGSprite 体积小，矢量 Iconfont 体积小，矢量，集成度高 Base64 减少对服务器请求 CSSSprite 减少对服务器请求 CSS Sprites 技术就是将这些小icon合并成一张图片,只需要加载一次,每次通过background-position来控制显示icon,这样就可以节约大量请求,节约成本.此方案是将网站上的一些小logo拼合成一个大图,如图： 然后通过 background-position 就可以定位到图标的位置了，css举例如下： .icon-mapselect{ background:url('../realtime/default/icon-realtime.png') no-repeat 0px -272px; width:18px; height:18px; } Base64 减少对服务器请求 使用base64编码的图片的优点在于可以减少http请求，也不占用服务器的内存资源，缺点在于base64格式的图片比原图大，占用了更多的存储空间，而且浏览器不会对该资源进行缓存。 实现方式： 1、将要图片转为base64的文字编码 使用该网站可以在线将图片转为base64格式 https://www.sojson.com/image2base64.html ,以下是网站使用方法：

在 CodeInsight 开发告一段落之后，CTO 大人找到我说要想一个把 Coding.net 的前端拆分重构的方案，于是我从一个欢脱的开发状态开始切换到要面对一句魔咒的考验。 动态语言一时爽，代码重构火葬场。 不管怎么样，先从梳理现状开始。 Coding 前端使用 Angular 构建，前端工程化还是使用合并文件打包的方式，并没有引入 CommonJS 之类的模块化开发方式，作为一个 SPA 网站，随着网站规模的增大，前端代码开始越来越臃肿，开发体验也直线下降，这是我们考虑重构的原因。 所以首先我们要想清楚重构要解决的问题 代码打包拆分，避免所有功能模块打包到单一的文件 引入 CommonJS 做到更清晰的模块化 边开车边换轮子 要做到最后一点尤其困难，但这也是我们能否顺利重构的关键，重构不是重写，所以如何在现有代码基础上重构，并且还要和当前的开发进度无缝衔接起来就是我们所要面临的一个挑战。 好消息是我们使用了 Angular 保证了我们的代码分 Module 有了一层封装，不至于太过散乱。作为一个 SPA 网站，前端路由已经很好的分离出了各个功能模块。我们用到了 Grunt，虽然有点过时，task 写得有点复杂，但是提供了一个工程化的切入口。 经过小伙伴们几轮讨论之后，最终确定了一套比较靠谱的方案： 按照功能模块重新整理／拆分代码 保持作为一个 SPA 网站

单例模式的几种方式，通用一点来说，分为两种，懒加载和非懒加载 1非懒加载 package com.thread.ch1; /** * 不能懒加载 */ public class SingletonObject1 { public static final SingletonObject1 instance = new SingletonObject1(); private SingletonObject1() { } public SingletonObject1 getInstance() { return instance; } } 2 其他的几个版本都是围绕懒加载来搞的 package com.thread.ch1; /** *双重校验 懒加载 */ public class SingletonObject5 { private static volatile SingletonObject5 instance; private SingletonObject5() { } public static SingletonObject5 getInstance() { if (instance == null) { synchronized (SingletonObject5.class){ if(null == instance) instance = new

问题 使用Spring Cloud组件构建的服务集群，在第一次请求时经常会出现timeout的情况，也就是超时，然而第二次就正常了 启动涉及到的相关服务： gateway(zuul网关) auth-Service（鉴权服务） user-Service（用户服务） 测试的端点接口为：http:/login/oauth/token。服务之间的调用顺序为：gateway->auth-Service->user-Service。网关收到客户端的请求，转发请求到鉴权服务，鉴权服务对用户身份的核验是通过调用用户服，用户服务给鉴权服务返回身份校验的结果，鉴权服务将身份授权信息返回给gateway，gateway将最终的结果response返回给客户端。三个服务启动后，通过zipkin监控调用链路信息，可以看到第一次和第二次调用情况如下图所示： 首次调用端点 第二次调用信息 通过上面两次的链路监控信息截图，可以看到第一次的耗时是第二次的10多倍。遇到某些情况，很可能会出现第一次请求的超时。去官网看了下，主要原因是zuul网关和各个调用服务之间的Ribbon进行客户端负载均衡的Client懒加载，导致第一次的请求调用包括了创建Ribbon Client的时间。通过启动日志信息就可以发现： Ribbon 客户端懒加载 下面分两部分解决这个问题，一是服务之间调用Ribbon的饥饿加载

Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的.在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服务器负担。 一、下载和引用 　　官网下载地址： http://plugins.jquery.com/lazyload/ 　　Lazy Load 依赖于 jQuery. 所以需要引用2个js <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.lazyload.js"></script> 二、简单调用 　　要使用懒加载，需要改变img的src标签 html代码 <img alt="" width="640" height="480" data-original="img/example.jpg" /> js代码 $(function() { $("img").lazyload(); }); 这样设置就会将所有的img的并且拥有data-original标签的图片更改为懒加载。 　　

一.什么是图片懒加载？ 　　- 案例分析：抓取站长素材http://sc.chinaz.com/中的图片数据 运行结果观察发现，我们可以获取图片的名称，但是链接获取的为空，检查后发现xpath表达式也没有问题，究其原因出在了哪里呢？ 　　- 图片懒加载概念： 　　　　图片懒加载是一种网页优化技术。图片作为一种网络资源，在被请求时也与普通静态资源一样，将占用网络资源，而一次性将整个页面的所有图片加载完，将大大增加页面的首屏加载时间。为了解决这种问题，通过前后端配合，使图片仅在浏览器当前视窗内出现时才加载该图片，达到减少首屏图片请求数的技术就被称为“图片懒加载”。 　　- 网站一般如何实现图片懒加载技术呢？ 　　　　在网页源码中，在img标签中首先会使用一个“伪属性”（通常使用src2，original......）去存放真正的图片链接而并非是直接存放在src属性中。当图片出现到页面的可视化区域中，会动态将伪属性替换成src属性，完成图片的加载。 　　- 站长素材案例后续分析：通过细致观察页面的结构后发现，网页中图片的链接是存储在了src2这个伪属性中 import requests from lxml import etree import urllib.request import os import json headers = { 'User-Agent': 'Mozilla

图片懒加载 概念 图片懒加载是一种网页优化技术。图片作为一种网络资源，在被请求时也与普通静态资源一样，将占用网络资源 ，而一次性将整个页面的所有图片加载完，将大大增加页面的首屏加载时间。为了解决这种问题，通过前后端配合， 使图片仅在浏览器当前视窗内出现时才加载该图片，达到减少首屏图片请求数的技术就被称为“图片懒加载”。 如何实现 　　在网页源码中，在img标签中首先会使用一个“伪属性”（通常使用src2，original......）去存放真正的图片 链接而并非是直接存放在src属性中。当图片出现到页面的可视化区域中，会动态将伪属性替换成src属性，完成图片的加载。 爬取方法 抓取伪属性 selenium 什么是selenium 是Python的一个第三方库，对外提供的接口可以操作浏览器，然后让浏览器完成自动化的操作。 环境搭建 1.安装selenum：pip install selenium 2.获取某一款浏览器的驱动程序（以谷歌浏览器为例）　 　　2.1 谷歌浏览器驱动下载地址：http://chromedriver.storage.googleapis.com/index.html 　　2.2 下载的驱动程序必须和浏览器的版本统一，大家可以根据http://blog.csdn.net/huilan_same/article/details