摘要:
前言:如果你碰巧是一名前端开发,而又碰巧在维护着一个对可用性有极高要求的站点,那么也许你我有过共同的苦恼:如何在第一时间发现线上出现的前端异常?毕竟前端不是每天都可以过网页裸奔节,线上的Javascript错误也足以让用户抓狂地拿起他们的投诉电话。。。每天心惊胆战发布的日子不好过吧?是时候改变下了,让心惊胆战见鬼去吧!我的目标很简单:要在用户和boss发现异常之前就彻底修复问题,其余的时间充分地享受高质量生活:)一:前端异常监控系统的构建目标在对被监控页面无侵入的前提下,提供7*24小时全天候的监控任务,第一时间发现“裸奔”、“半裸奔”页面或是有Javascript异常抛出的页面,并给网站前端 阅读全文
摘要:
一直想写这篇“十日谈”,聊聊我对Web前端开发的体会,顺便解答下周围不少人的困惑和迷惘。我不打算聊太多技术,我想,通过技术的历练,得到的反思应当更重要。我一直认为自己是“初级”前端开发工程师,一方面我入道尚浅,只有短短几年,另一方面我自知对技术的钻研并不深入,可能是由于环境的原因,当然最重要的是,我幸运的参与到互联网崛起的浪潮之巅。时势造就了一批技能薄弱但备受追捧的“弄潮者”,这在很大程度上影响我们对“技术本质”的洞察力,多年来也一直未有成体系的“前端技术”布道佳作,以至于当下多数人对前端技术的了解,盖始于表述并不严谨的岗位招聘描述,而这正恰恰反映了Web前端开发对自身的模糊定位。对于很多We 阅读全文
摘要:
个人近期整理了下前端工具,还算比较全,希望大家喜欢,赶快收藏吧!一、常用书籍1.强烈推荐Book Shelf 2.0,分类很清晰,下载很方便,谁试谁知道2.51cnnet3.原版图书免费下载链接收集站二、常用FF插件1.Firebug:FF神器,不用介绍了2.YSlow:对网站的页面进行分析,并告诉你为了提高网站性能,如何基于某些规则而进行优化3.web developer:其拥有强大的CSS调试和Form调试能力,对页面的分析非常全面,可以禁止页面的任一内联、文档、和外部CSS,可以直接编辑当前CSS,可以直接加载本地的CSS,可以用鼠标点击查看页面内任一元素的CSS,可以查看盒子模型结果, 阅读全文
摘要:
互联网日志划分页面访问日志:每个页面装载head部分的时候,下载一个js,这个js将发送一个请求到日志服务器,请求中包含了同步在淘宝cookie的本地cookie信息,也包含了refer/url/要获取的header参数/session的信息,由此完成pv/uv的默认计算,淘宝的atp.js就是完成这个工作,而google统计的ga.js是完成同样的事情页面交互日志:用户在页面上某个行为触发一个异步请求,按照约定的格式向日志服务器发送请求,展现、点击、等待、报错等等都可以作为交互行为,黄金令箭就是实现这个,在通用统计工具中,没有这类数据的采集和计算模块曝光日志:页面在展现一个区块的时候,这个模 阅读全文
摘要:
1、1 var x = 10;2 function foo() {3 alert(x);4 }5 (function () {6 var x = 20;7 foo(); 8 })();2、1 function a(x) {2 return x * 2;3 }4 var a;5 alert(a);3、1 if (!("a" in window)) {2 var a = 1;3 }4 alert(a);4、function b(x, y, a) { arguments[2] = 10; alert(a);}b(1, 2, 3);5、1 function ... 阅读全文
摘要:
HTML5作为HTML的升级版本,越来越多的开发者和设计师开始使用HTML5.今天我们要介绍的是最好的几个 HTML5/CSS3 的演示(PPT)工具和框架,你可以用它们来创建你的网页PPT,效果超炫。1. Impress.js这个工具之前OSChina有介绍过。它主要是基于CSS3的变换和切换。只有现代浏览器支持,效果很震撼。(演示地址) 2.Reveal.js这是一个基于CSS的3D幻灯片工具。它不依赖任何外部类库,除了已经被包含在发布带帽中的highlight.js,3D效果超炫。(演示地址)3.html5 Slides这是 Google 提供的 HTML5 幻灯片模板。你可以下载这个模 阅读全文
摘要:
安装Sublime Text 2插件的方法:1.直接安装安装Sublime text 2插件很方便,可以直接下载安装包解压缩到Packages目录(菜单->preferences->packages)。2.使用Package Control组件安装也可以安装package control组件,然后直接在线安装:按Ctrl+`调出console粘贴以下代码到底部命令行并回车:import urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.ma 阅读全文
摘要:
本章主要是介绍Bootstrap默认的基础样式定义,利用这些基础的定义相互组合,完成页面的整体风格定义甚至是更具体的效果。Bootstrap应该是一个基础工具,它的好处在于已经帮你定义了一个基础的样式风格,对一个网站来说,风格统一的页面们是相当重要的(除非你的站点已经复杂到需要做一些定制化的页面);还解决了主流浏览器兼容问题。但对于国内的使用者来说,存在一个比较严重的问题——并不支持IE6。就我个人的认知来看,在使用的时候,我们总是需要根据自己的需求对Bootstrap框架做一些调整,比如兼容ie6,比如更换部分组件的风格,比如增加图标或去除不需要的图标,比如增加一些组件样式支持等等等等。本章 阅读全文
摘要:
Responsive IllustrationPortalsBowieFocusRainCarve MeBokehMonsterTilt ShiftI Love BlurFlashlightIconsSolar SystemLeica3D Domo3D iPhoneMac OSX LionLoading Loop SetOn Off文章出处:http://www.queness.com/post/12152/showcase-of-really-awesome-css3-demo 阅读全文
摘要:
在kissy1.2的工程内,一切皆是模块,无论js还是css,都可以采用kissy1,2的loader异步加载进来,当然本文只讨论js的情况。模块遵循的关键原则1.模块书写必须符合基本书写格式kissy1.2的js模块文件,基础模板如下:?123456KISSY.add(function(S) {function model(){}return model;}, {requires:[]});文件的js代码起始必须是KISSY.add()定义的模块必须有return值使用requires数组处理模块依赖2.模块功能单一性原则在kissy1.2的模块系统中,我们希望一个模块只做一件事情,就像乐高 阅读全文