201510-27 前端优化带来的思考,浅谈前端工程化 HOT 重复优化的思考这段时间对项目做了一次整体的优化,全站有了20%左右的提升(本来载入速度已经1.2S左右了,优化度很低),算一算已经做了四轮的全站性能优化了,回顾几次的优化手段,基本上几个字就能说清楚:传输层面:减少请求数,降低请求量执行层面:减少重绘&回流传输层面的从来都是优化的核心点,而这个层面的优化要对浏览器有一个基本的认识,比如:①网页自上而下的解析渲染,边解析边渲染,页面内CSS文件会阻塞渲染,... 继续阅读 >
201510-26 关于网站性能优化准则 这几日拜读了SteveSouders的《高性能网站建设指南这本书》,虽然这本书可能已经有些老了,但薄薄的一个小册子里提出的网站性能优化的准则还是非常有价值的。这些规则都有个共同点,就是用很小的工作就能获得很明显的性能提升,性价比极高。废话不多说了,总结一下书里的几点性能优化规则。首先有一点需要说明的是书中所写的性能黄金法则:只有10%~20%的响应时间花在了下载HTML文档上,其余的80%~90%时间花在了下载页面... 继续阅读 >
201510-24 干货:8小时搞定一款app的关键词优化 HOT 本文作者苏畅(微信ID:sumoren),文章内容是根据其所在公司深圳市零一互动举办的一场ASO分享整理成文。分享中,两位ASO大牛分别分享了iOS和安卓应用的搜索优化。相信有些朋友对aso不是特别熟悉,我在这里做下解释。Aso原意是app在iOS端的优化,后来慢慢演变成了app在iOS、安卓的各个渠道的优化。在iOS端,因为苹果的AppStore霸占了绝大多数的市场,所以一般优化策略都是针对AppStore市场,而安卓端... 继续阅读 >
201510-23 项目目录结构规范 简介该文档主要的设计目标是项目开发的目录结构保持一致,使容易理解并方便构建与管理。编撰李玉北、erik、黄后锦、王杨、张立理、赵雷、陈新乐、刘恺华。本文档由商业运营体系前端技术组审校发布。要求在本文档中,使用的关键字会以中文+括号包含的关键字英文表示:必须(MUST)。关键字"MUST","MUSTNOT","REQUIRED","SHALL","SHALLNOT","SHOULD","SHOULDNOT","RECOMMENDED","MAY",and"OPTIONAL"被定义在rfc211... 继续阅读 >
201510-23 Less 编码规范 简介该文档主要的设计目标是提高Less文档的团队一致性与可维护性。Less代码的基本规范和原则与CSS编码规范保持一致。编撰erik、顾轶灵、黄后锦、李玉北、赵雷。本文档由商业运营体系前端技术组审校发布。要求在本文档中,使用的关键字会以中文+括号包含的关键字英文表示:必须(MUST)。关键字"MUST","MUSTNOT","REQUIRED","SHALL","SHALLNOT","SHOULD","SHOULDNOT","RECOMMENDED","MAY",and"OPTIONAL"... 继续阅读 >
201510-23 JavaScript编码规范 推荐 1前言2代码风格2.1文件2.2结构2.2.1缩进2.2.2空格2.2.3换行2.2.4语句2.3命名2.4注释2.4.1单行注释2.4.2多行注释2.4.3文档化注释2.4.4类型定义2.4.5文件注释2.4.6命名空间注释2.4.7类注释2.4.8函数/方法注释2.4.9事件注释2.4.10常量注释2.4.1... 继续阅读 >
201510-23 HTML5 Charset能用吗? 前一段某项目中页面在IE6突然出现了乱码,当时做了各种排查,最终推测是使用了HTML5的DOCTYPE和Charset以及中文注释的问题,于是临时采用旧的Charset方法来修复了下,后面乱码再没出现。其实一直不太确定HTML5的Charset能否被IE6识别,于是做了一些测试。先说下两种Charset声明方法,其实大家应该都很熟悉的:后面我们简称第一种方法为HTML5方法,第二种方法为HTML4方法。测试环境:WindowsXPSp2,中文版+英文版两个版本的... 继续阅读 >
201510-23 HTML编码规范 1前言2代码风格2.1缩进与换行2.2命名2.3标签2.4属性3通用3.1DOCTYPE3.2编码3.3CSS和JavaScript引入4head4.1title4.2favicon4.3viewport5图片6表单6.1控件标题6.2按钮6.3可访问性(A11Y)7多媒体8模板中的HTML1前言HTML作为描述网页结构的超文本标记语言,在百度一直有着广泛的应用。本文档的目标是使HTML... 继续阅读 >
201510-23 产品规范开发流程 推荐 开发准备了解产品和设计参加需求、交互、视觉会议,了解产品设计和项目成员。了解产品面向的设备和平台。了解产品对兼容性的要求以及是否采用响应式设计等。了解产品要使用的技术(WEB技术、桌面技术、APP技术、模板语言、混合模式等)。提出疑问和见解在交互或视觉会议中结合技术要求,提出疑问和见解。提出可能存在的问题(技术实现问题、性能问题等),协商解决方案(如优雅退化... 继续阅读 >
201510-22 26个Jquery使用小技巧 下面列出了一些Jquery使用技巧。比如有禁止右键点击、隐藏搜索文本框文字、在新窗口中打开链接、检测浏览器、预加载图片、页面样式切换、所有列等高、动态控制页面字体大小、获得鼠标指针的X值Y值、验证元素是否为空、替换元素、延迟加载、验证元素是否存在于Jquery集合中、使DIV可点击、克隆对象、使元素居中、计算元素个数、使用Google主机上的Jquery类库、禁用Jquery效果、解决Jquery类库与其他Javascript类库冲突问题。... 继续阅读 >
201510-22 浅谈 JS 创建对象的 8 种模式 HOT 1.Object模式varo1={};//字面量的表现形式varo2=newObject;varo3=newObject();varo4=newObject(null);varo5=newObject(undefined);varo6=Object.create(Object.prototype);//等价于varo={};//即以Object.prototype对象为一个原型模板,新建一个以这个原型模板为原型的对象//区别varo7=Object.create(null);//创建一个原型为null的对象在chrome里查看各个新建对象的区别:可以看出前6种模式创... 继续阅读 >
201510-22 编写高质量JavaScript代码 推荐 才华横溢的StoyanStefanov,在他写的由O’Reilly初版的新书《JavaScriptPatterns》(JavaScript模式)中,我想要是为我们的读者贡献其摘要,那会是件很美妙的事情。具体一点就是编写高质量JavaScript的一些要素,例如避免全局变量,使用单变量声明,在循环中预缓存length(长度),遵循代码阅读,以及更多。此摘要也包括一些与代码不太相关的习惯,但对整体代码的创建息息相关,包括撰写API文档、执行同行评审以及运行JSLint。这些... 继续阅读 >
201510-22 10个必须把握的jQuery小技巧 推荐 收集的10个jQuery小技巧/代码片段,可以帮你快速开发。1.返回顶部按钮你可以利用animate和scrollTop来实现返回顶部的动画,而不需要使用其他插件。//Backtotop$('a.top').click(function(){$(document.body).animate({scrollTop:0},800);returnfalse;});<!--Createananchortag--><aclass="top"href="#">Backtotop</a>改变scrollTop的值可以调整返回距离顶部的距离,而animate的第二个参数是执行返回动... 继续阅读 >
201510-15 PHP 判断设备是否是手机还是平板的方法 推荐 /***PHP判断设备是否是手机还是平板的方法*@staticvarbool$is_mobile*@returnbool*/functionwp_is_mobile(){static$is_mobile=null;if(isset($is_mobile)){return$is_mobile;}if(empty($_SERVER['HTTP_USER_AGENT'])){$is_mobile=false;}elseif(strpos($_SERVER['HTTP_USER_AGENT'],'Mobile')!==false//manymobiledevices(alliPhone,iPad,etc.)||strpos($_SERV... 继续阅读 >
201510-13 站长必须知道这些有利于SEO的网站 推荐 一个新的网站上线之后,最基本的SEO内容就是将网站域名加入到各种站长平台,提交到各种所有引擎入口,这里收录了几乎所有的网站大全,将网站提交到这些平台中,你的网站将大大提高权重。一、搜索引擎网站收录地址大全|SearchEngine搜索引擎提交网址百度搜索网址提交入口口http://zhanzhang.baidu.com/sitesubmit/index360搜索引擎登录入口http://i... 继续阅读 >
201510-08 基于 HTML5 的 3D 网络拓扑树呈现 HOT 在HTforWeb中2D和3D应用都支持树状结构数据的展示,展现效果各异,2D上的树状结构在展现层级关系明显,但是如果数据量大的话,看起来就没那么直观,找到指定的节点比较困难,而3D上的树状结构在展现上配合HTforWeb的弹力布局组件会显得比较直观,一眼望去可以把整个树状结构数据看个大概,但是在弹力布局的作用下,其层次结构看得就不是那么清晰了。所以这时候结构清晰的3D树的需求就来了,那么这个3D树具体长成啥样呢,我们... 继续阅读 >
201509-30 使用字符串(STRINGS)设置样式 推荐 今年在墨尔本(澳大利亚)举办的CSSConf中,我有一个主题需要演讲——"StylingWithSTRINGS"。该讲座主要介绍的是在组件中如何使用Flexbox、currentColor和em,在浏览器中快速实现Web应用程序所需要的风格。特别提醒:原文提供了一个视频,不过需要翻。大家都懂的。这里归纳了几个要点:布局(Layout)当你创建一个移动应用的布局时,并不是整个页面滑动,而只是某些部分。比如说,页面的头部和脚部是固定的,只是中间的主内容区... 继续阅读 >
201509-30 CSS中你不知道的小技巧 推荐 CSS中的级联(cascade)在同一时间可谓是幸福的,也可以说是痛苦不堪的。通常能工作得非常好,但有问题的时候,也让人们都很激动,甚至事件中也离开不CSS。我们所涉及的不仅是CSS的级联也还涉及到CSS的权重。不是说碰到特殊问题才显得困难,可以说CSS的困难无处不在。在这篇文章中,我将通过一些示例来向大家展示一些CSS的小技巧,让你知道如何使用CSS的级联能变得更友好,也减少一些不必要的需求,从而也减少权重上遇到的麻烦。... 继续阅读 >
201509-30 无聊的前端工程师 酷炫的前端工程师热衷于超越各种极限,他们总喜欢追逐最新、最优秀、最耀眼的用户界面框架和前端编程库。我们经常发现,他们一直在试图缩小Web程序与原生程序之间的差距,而且,正是由于这个原因,他们已将用户界面的外观和行为变得越来越像一款原生程序。你可能会问,是哪一类应用程序?iPhone?Android?哪个版本?这些问题都很不错,可惜与我们讨论的主题无关。然而,还有一类前端工程师,我们姑且称其为无聊的前端工程... 继续阅读 >
201509-30 深入学习JavaScript对象 JavaScript中,除了五种原始类型(即数字,字符串,布尔值,null,undefined)之外的都是对象了,所以,不把对象学明白怎么继续往下学习呢?一.概述对象是一种复合值,它将很多值(原始值或其他对象)聚合在一起,可通过属性名访问这些值。而属性名可以是包含空字符串在内的任意字符串。JavaScript对象也可以称作一种数据结构,正如我们经常听说的“散列(hash)”、“散列表(hashtable)”、&ld... 继续阅读 >
201509-26 深入浅出 妙用Javascript中apply、call、bind 网上文章虽多,大多复制粘贴,且晦涩难懂,我希望能够通过这篇文章,能够清晰的提升对apply、call、bind的认识,并且列出一些它们的妙用加深记忆。apply、call 在javascript中,call和apply都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部this的指向。JavaScript的一大特点是,函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」... 继续阅读 >
201509-21 HTML必须知道的一些知识点 推荐 一、标签语义化html标签语义化是让大家直观的认识标签和属性的用途和作用,好处最主要的是对搜索引擎友好。Eg:1、如果你想在页面中突出”奥巴马”这三个字,让搜索引擎重视它,如果你这么写:<div> 奥巴马</div>对于搜索引擎来说,它也只是一个普通得不能再普通的三个字而已,尽管它是指代美国总统。那么应该怎样才能让搜索引擎知道它的重要性呢?来看看语义化的写法吧:<h1>奥巴马</h1>奥巴马看了后,乐了,哥本来就应该备受... 继续阅读 >
201509-18 网页性能管理详解 你遇到过性能很差的网页吗?这种网页响应非常缓慢,占用大量的CPU和内存,浏览起来常常有卡顿,页面的动画效果也不流畅。你会有什么反应?我猜想,大多数用户会关闭这个页面,改为访问其他网站。作为一个开发者,肯定不愿意看到这种情况,那么怎样才能提高性能呢?本文将详细介绍性能问题的出现原因,以及解决方法。一、网页生成的过程要理解网页性能为什么不好,就要了解网页是怎么生成的。网... 继续阅读 >
201509-17 百度蜘蛛抓取网站的基本规则 网站做优化的都是希望搜索引擎蜘蛛可以快速抓取,这些大家都是希望的。但是蜘蛛抓取SEO网站的基本规则又是怎样的?第一:高质量内容网站高质量内容永远是搜索引擎蜘蛛抓取的首选。不管是谷歌还是百度,高质量的东西都是搜索引擎争抢的热点。还有就是蜘蛛和用户一样都是很喜欢新的东西,很久没有更新的网站内容,对搜索引擎蜘蛛没有丝毫吸引力。因此蜘蛛只会索引到网站,但不会把网站内容放进数据库。所以必要的高质量的内容... 继续阅读 >