suqing
- 浏览: 186757 次
- 性别:
- 来自: 杭州
-
最新评论
-
w547377507：
注册账号来赞你！
Bootstrap 源码解析 -
xyixiaochuan：
// IIFE - Immediately Invok ...
IIFE -
jozo：
[color=orange][/color]
Quickling技术 -
raoyutao：
...
Bootstrap 源码解析 -
springmvc-freemarker：
bootstrap demo实例教程源代码下载:http:// ...
Bootstrap 源码解析
文章列表
核对出行准备清单：
1、遮阳伞、草帽、太阳镜、防晒霜
2、毛巾、牙刷、水乳液洗面奶面膜、花露水、(创可贴、口罩)、眼罩/U型枕、万能头巾、多备几个塑料袋、纸巾
3、换洗衣5套，睡衣。注意早晚温差，备外套。
4、牛肉干、巧克力、口香糖
5、行程、合同
6、电子产品：手机(充电)、mini(充电)或Kindle、耳机、（当地电话卡、wifi）
7、随身：身份证、钱包（取现金兑换货币）、手机、纸巾、360ml水、遮阳伞、防晒衣、扇子
工具类产品的可用性度量方法
- 博客分类：
- 交互设计
信息型产品代表是淘宝网，淘宝网的可用性度量可以通过这么几个指标：PV（Page View）、UV（User View）、转化率。简单来说，评判一个设计的好坏就是它所产生的商业价值。
工具类平台不同，属于功能型产品，用户群比较固定，访问量也比较稳定，服务类产品不会考虑商业化的问题。所以这几个指标不太适用。最终产生价值是的减少用户时间，提高生产率。
总结工具平台型产品的特质：1、用户群固定，大多是技术人员；
前端模块化解决什么问题？
有了模块，我就可以很方便的使用别人的代码，想要什么功能，就用加载什么模块。但是，这样做需要有一个前提，那就是大家必须以同样的方式编写模块，否则就乱套了。所以组内需要有一套统一 ...
先说明一点，对于故障的认识：
任何事情都是团队的事情，不是一个人能承担的。
仅仅是个人意识靠不住，需要团队合作来保证。
事故预防处理
注重流程：先部署到测试环境，验证后，部署到线上；交叉测试
代码质量控制：code review；相互review
管理TC，明确校验点
部署控制：定时部署，控制修改线上需求
任务分级：轻重缓急
自动回归
…
事故处理：
恢复时间可以是从报错到找到原因并修复的这段时间，不用将部署的时间算进去。
对于严重的故障，进行紧急部署
先说个段子：
公司有个技术牛人，某产品专员向他提单，牛人一看内容很扯，质问“你觉得这个需求有价值吗？”
对方诚恳回答：“没价值，但是我总得写周报啊。”
牛人想了一分钟，回答说好吧我帮你做，因为我也得写周报啊。
周报越写越流水账，怎么让周报有意义。形式不重要，是让别人了解自己工作的价值，也是自己一周的汇总思考。
可以写什么呢，
结合部门的要什么、不要什么，周报里面体现good case，bad case， 有的话就写出来，不强求。
项目情况，包括项目进度，项目阶段（需求分析阶段、原型设计阶段、开发测试阶段…）
缺陷情况：我发现了多少线上问题，解决了多少问 ...
rem是一个非常酷的CSS3属性，它相对于根元素<html>的字体大小适配。举一个非常简单的场景，要根据3种屏幕大小适配字体：
通常这么实现：
/* Document level adjustments */
html {
font-size: 17px;
}
@media (max-width: 900px) {
html { font-size: 15px; }
}
@media (max-width: 400px) {
html { font-size: 13px; }
}
/* Type will scale with docu ...
Bootstrap 源码解析
- 博客分类：
- 前端开发
1、Bootstrap的作用域
2、Bootstrap的类定义
3、Bootstrap的插件定义
4、Bootstrap的事件代理
5、Bootstrap的对象数据缓存
6、Bootstrap的防冲突
7、作用域外如何使用Button类
8、Bootstrap的单元测试
Bootstrap的作用域
Bootstrap每个插件都定义在下面这段作用域代码中：
+function ($) { "use strict";
...
}(window.jQuery);
请看《IIFE》和《严格模式》编译环境。
在插件的作用域之 ...
前端特别需要关注：
1. 用户身份 (web\无线，TL\测试，系统长期用户\系统新手、技术能力)
2. 交互视觉是否是用户喜欢的
3. 界面分类排版合理
4. 页面功能、规则、流程描述清晰易懂 ，是否有看不懂的地方
5. 改版内容有吸引力
6. 页面打开速度
介绍IIFE;
IIFE的性能;
使用IIFE的好处;
IIFE最佳实践;
jQuery优化;
在Bootstrap源码(具体请看《Bootstrap源码解析》)和其他jQuery插件经常看到如下的写法：
+function ($) {
}(window.jQuery);
这种写法称为：
IIFE （Imdiately Invoked Function Expression 立即执行的函数表达式）。
一步步来分析这段代码。
先弄清 函数表达式（function expression）和 函数声明（function declaration ...
先了解一个概念“软件架构”
软件架构：软件系统的架构将系统描述为计算组件及组件之间的交互。（Mary Shaw）
前端架构：和前端相关的软件架构。
前端架构 = 前端组件 + 组件之间的交互。
K的前端架构
K前端要解决的问题
1、Bootstrap Enhanced/Extend未覆盖的场景
2、Bootstrap 修改成本高的部分
3、不满足平台建设的用户体验
4、定制需求
5、外部组件的视觉统一
K业务前端通用类库
1、产品搜索
2、用户搜索
3、线上监控
4、快捷键
。。。
基于场景、产品可用性设计准则
这里下载，如果下载不了到这个备份下载v1.9.7
配置环境变量 D:\Program Files\phantomjs-1.9.7-windows;
Chrome Console使用技巧
- 博客分类：
- 前端开发
打开浏览器，按F12，选择console标签页；出现浏览器控制台。
在Chrome下为了演示JS， 有时候我们需要将改变console的字体大小，将console的字体放大。方法是改变chrome自定义文件Custom.css的样式，路径在Windows: C:\Users\<user>\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets
Mac OS X: ~/Library/Application Support/Google/Chrome/Default/User Stylesheets/
覆盖 ...
如何测试Javascript代码的垃圾回收
- 博客分类：
- 前端测试
一个小技巧。首先打开最新版的chrome浏览器。
chrome能测试Javascript的内存堆（分配给js对象的内存）的状况，需要输入一段代码启动它：
chrome --enable-memory-info
接着，创建一个HTML文件，如下：
<script>
var i = 0;
setInterval(function(){
var before = window.performance.memory.usedJSHeapSize;
// Start
i = i + 10;
// End
var ...
WebDevCheckList这个网站提供了一个完整的测试清单，并在每一个测试项中提供了一些帮助信息和测试工
具。测试后，你还可以在复选框中打勾，以避免遗漏。
最佳实践
检测断掉的链接
W3C link checker
iWebTool Broken Link Checker
检测拼写
验证各个浏览器
BrowserShots.org
Browserling.com
Spoon.net
移除域名的www.前缀
Remove 'www' in web.config
可用性
HTML5兼容性检测
Compat Inspector
modern.I ...
介绍IIFE
IIFE的性能
使用IIFE的好处
IIFE最佳实践
jQuery优化
在Bootstrap源码(具体请看《Bootstrap源码解析》)和其他jQuery插件经常看到如下的写法：
+function ($) {
}(window.jQuery);
这种写法称为：
IIFE （Imdiately Invoked Function Expression 立即执行的函数表达式）。
一步步来分析这段代码。
先弄清 函数表达式（function expression）和 函数声明（function declaration）的区别： ...