摘要: 我们在上一篇介绍了JS Object的实现,这一篇将进一步介绍JS Array的实现。 在此之前,笔者将Chromium升级到了最新版本60,上一次是在元旦的时候下的57,而当前最新发布的稳定版本是57。57是三月上旬发布的,所以Chrome发布一个大版本至少用了两、三个月的时间。Chrome 60 阅读全文
posted @ 2017-04-16 20:04 会编程的银猪 阅读(2630) 评论(1) 推荐(4) 编辑
摘要: 什么是页面卡顿?如下: 当拖动页面或者滚动的时候页面一卡一卡的,看起来不连贯,我们就说页面卡了,这是一种非常不友好的体验,怎么衡量页面卡顿的情况呢? 1. 失帧和帧率FPS 如果你家里买了电视盒的话,在设置里面应该会有一个输出设置: 上面选中的60Hz就是帧率(frame per second),即 阅读全文
posted @ 2017-02-09 21:05 会编程的银猪 阅读(1837) 评论(1) 推荐(4) 编辑
摘要: 在上一篇《从Chrome源码看浏览器如何构建DOM树》介绍了blink如何创建一棵DOM树,在这一篇将介绍事件机制。 上一篇还有一个地方未提及,那就是在构建完DOM之后,浏览器将会触发DOMContentLoaded事件,这个事件是在处理tokens的时候遇到EndOfFile标志符时触发的: C+ 阅读全文
posted @ 2017-02-05 18:19 会编程的银猪 阅读(1617) 评论(0) 推荐(3) 编辑
摘要: 最近下了Chrome的源码,安装了一个debug版的Chromium研究了一下,虽然很多地方都一知半解,但是还是有一点收获,将在这篇文章介绍DOM树是如何构建的,看了本文应该可以回答以下问题: IE用的是Trident内核,Safari用的是Webkit,Chrome用的是Blink,到底什么是内核 阅读全文
posted @ 2017-01-15 22:00 会编程的银猪 阅读(3244) 评论(2) 推荐(7) 编辑
摘要: 什么是代码耦合?代码耦合的表现是改了一点毛发而牵动了全身,或者是想要改点东西,需要在一堆代码里面找半天。由于前端需要组织js/css/html,耦合的问题可能会更加明显,下面按照耦合的情况分别说明: 1. 避免全局耦合 这应该是比较常见的耦合。全局耦合就是几个类、模块共用了全局变量或者全局数据结构, 阅读全文
posted @ 2016-12-20 20:21 会编程的银猪 阅读(1003) 评论(1) 推荐(3) 编辑
摘要: 本文介绍https连接的过程,通过抓包工具一步步分析https连接建立过程,尝试回答下面的问题:1.为什么https是安全的,安全在哪里?2.https是通过证书保证它的安全的么?3.如何检验证书的合法性?4. 证书为什么要购买?相信看了本文会有一个答案 阅读全文
posted @ 2016-11-13 22:30 会编程的银猪 阅读(2861) 评论(4) 推荐(16) 编辑
摘要: 伪元素是一个好东西,但是很多人都没怎么用,因为他们觉得伪元素太诡异了。其实使用伪元素有很多好处,最大的好处是它可以简化页面的html标签,同时用起来也很方便,善于使用伪元素可以让你的页面更加地简洁优雅。 更好的阅读体验移步:http://yincheng.site/using-before-afte 阅读全文
posted @ 2016-10-30 16:01 会编程的银猪 阅读(1332) 评论(0) 推荐(2) 编辑
摘要: 三角形的场景很常见,打开一个页面可以看到各种各样的三角形: 由于div一般是四边形,要画个三角形并不是那么直观。你可以贴一张png,但是这种办法有点low,或者是用svg的形式,但是太麻烦。三角形其实可以用CSS画出来。如上图提到,可以分为两种三角形,一种是纯色的三角形,第二种是有边框色的三角形,先 阅读全文
posted @ 2016-10-22 19:15 会编程的银猪 阅读(2116) 评论(0) 推荐(2) 编辑
摘要: 由于前端是不能直接操作本地文件的,要么通过<input type="file">用户点击选择文件或者拖拽的方式,要么使用flash等第三方的控件,但flash日渐衰落,所以使用flash还是不提倡的。同时html5崛起,提供了很多的api操控,可以在前端使用原生的api实现图片的处理,这样可以减少后 阅读全文
posted @ 2016-10-16 12:27 会编程的银猪 阅读(3611) 评论(13) 推荐(8) 编辑
摘要: 借用Effective之名,开始写Effective系列,总结一些前端的心得。 有些人写页面会走向一个极端,几乎页面所有的标签都用div,究其原因,用div有很多好处,一个是div没有默认样式,不会有margin、background等初始化设置,另外可能会觉得不用div还能用啥。所以看他的页面,一 阅读全文
posted @ 2016-09-25 23:10 会编程的银猪 阅读(1032) 评论(5) 推荐(3) 编辑
摘要: 借用Effective之名,开始写Effective系列,总结一些前端的心得。 为什么说能使用html/css解决的问题就不要使用JS呢?两个字,因为简单。简单就意味着更快的开发速度,更小的维护成本,同时往往具有更好的体验,下面介绍几个实例。 1. 导航高亮 导航高亮是一种很常见的问题,包括当前页面 阅读全文
posted @ 2016-09-17 15:10 会编程的银猪 阅读(919) 评论(0) 推荐(3) 编辑
摘要: 在上一篇《webpack从入门到上线》介绍了wepack的配置和相关的概念,这一篇介绍怎样写一个webpack loader. 通过写一个js的html模板为例子。 上篇文章已提及,loader加载器就是对各种非正常资源的解析,转化成浏览器可以识别的js/css文件等,甚至可以说loader就是一个 阅读全文
posted @ 2016-09-16 18:32 会编程的银猪 阅读(4170) 评论(1) 推荐(1) 编辑
摘要: webpack是目前一个很热门的前端打包工具,官网说得很清楚,webpack的出现就是要把requirejs干掉。同时它还提供了十分便利的本地开发的环境。网上并不容易找到一个讲解得比较详细完整的教程,本文结合实践经验,总结一套可用的开发和上线的配置和流程。 首先,Require JS有什么问题 Re 阅读全文
posted @ 2016-09-07 00:05 会编程的银猪 阅读(15989) 评论(8) 推荐(6) 编辑
摘要: 我们经常使用地图查位置、看公交、看街景,同时地图还开放第三方的API给开发者。利用这些API进行地图的个性化的展示和控制,例如北京被水淹了,开发一个网页显示北京被淹的地图,地图上面标志被水淹的位置、严重程度,或者我是交警,想要在地图上标志发生车祸、被交通管制的路段,甚至是利用地图的街景,控制街景的位 阅读全文
posted @ 2016-08-21 19:45 会编程的银猪 阅读(21347) 评论(9) 推荐(6) 编辑
摘要: 本文介绍使用图标字体和SVG取代雪碧图的方法。雪碧图是很多网站经常用到的一种技术,但是它有缺点:高清屏会模糊、无法动态变化如hover时候反色。而使用图标字体可以完美解决上述问题,同时具备兼容性好,生成的文件小等优点。 阅读全文
posted @ 2016-05-01 17:08 会编程的银猪 阅读(5725) 评论(11) 推荐(15) 编辑
摘要: 比较深入全面地介绍了什么是同源策略,同源策略的影响以及如何绕过同源策略进行CSRF攻击。同时跨域请求的实际应用,通过案例分析跨域请求的几种办法:cors、jsonp、子域域父域、iframe跨父域、postMessage实现frame和父窗口的通信 阅读全文
posted @ 2016-02-19 21:23 会编程的银猪 阅读(4502) 评论(2) 推荐(5) 编辑
摘要: 依据w3c标准,重点介绍html5语义性标签的章节(outline)作用,以及使用html5新标签的好处 阅读全文
posted @ 2016-02-17 22:16 会编程的银猪 阅读(8422) 评论(0) 推荐(0) 编辑
摘要: logstash是一个强大的分析后端日志的开源软件,本文详细介绍了logstash的配置和图表使用,通过对访问日志的分析,能够抓取用户的地域分布、使用的终端、感兴趣的功能,接口的访问时间排序,或者是异常检测等等,而这些可以通过图表的方式很直观地展示出来,还可以进行关联操作。 阅读全文
posted @ 2016-02-01 14:49 会编程的银猪 阅读(159208) 评论(5) 推荐(7) 编辑
摘要: 写了一个跨浏览器的html5表单验证插件,能够支持老的浏览器,并且统一错误文案提示的UI,提供了自定义文案、自定义样式的功能,支持多种错误类型的检验,同时支持自定义检验和异步检验。已经在生产环境得到很好的尝试 阅读全文
posted @ 2016-01-29 23:13 会编程的银猪 阅读(5376) 评论(0) 推荐(5) 编辑
摘要: 居中在切图的时候是一个经常遇到的问题,有些时候不太好处理。这篇博客通过一个案例的变化,讨论了几种常见的左右和垂直居中的方式。一方面是做个总结,另一方面是寻求更好更合适的居中方式。 阅读全文
posted @ 2015-12-25 20:48 会编程的银猪 阅读(3130) 评论(4) 推荐(17) 编辑