随笔分类 - 文章
摘要:每个前端在第一次写一个完整功能的页面,都可能会是这个样子滴~ <html> <head> <link rel="stylesheet" href="test.css"> </head> <body> <div id="app"></div> <script src="test.js"></scrip
阅读全文
摘要:浏览器如何渲染网页 要了解浏览器渲染页面的过程,首先得知道一个名词——关键渲染路径。关键渲染路径是指浏览器从最初接收请求来的HTML、CSS、javascript等资源,然后解析、构建树、渲染布局、绘制,最后呈现给用户能看到的界面这整个过程。 用户看到页面实际上可以分为两个阶段:页面内容加载完成和页
阅读全文
摘要:一、浏览器渲染 开篇,我们还是不厌其烦的回顾一下浏览器的渲染过程,先上图: 正如上图所展示的,我们浏览器渲染过程分为了两条主线:其一,html Parser 生成的 DOM 树;其二,CSS Parser 生成的 Style Rules ; 在这之后,DOM 树与 Style Rules 会生成一个
阅读全文
摘要:所谓软件架构风格,是指描述某个特定应用领域中系统组织方式的惯用模式。架构风格定义一个词汇表和一组约束,词汇表中包含一些组件及连接器,约束则指出系统如何将构建和连接器组合起来。软件架构风格反映了领域中众多系统所共有的结构和语义特性,并指导如何将系统中的各个模块和子系统有机的结合为一个完整的系统 没多少
阅读全文
摘要:前端代码异常监控实战 前言 之前在对公司的前端代码脚本错误进行排查,试图降低 JS Error 的错误量,结合自己之前的经验对这方面内容进行了实践并总结,下面就此谈谈我对前端代码异常监控的一些见解。 本文大致围绕下面几点展开讨论: JS 异常处理 对于 Javascript 而言,我们面对的仅仅只是
阅读全文
摘要://进阶用法 //格式化输出 console.log支持的格式标志有: console.log支持的格式标志有: %s 占位符 %d 或 %i 整数 %f 浮点数 %o%O object对象 %c css样式 //高级用法
阅读全文
摘要:timing (PerformanceTiming) 从输入url到用户可以使用页面的全过程时间统计,会返回一个PerformanceTiming对象,单位均为毫秒 按触发顺序排列所有属性:(更详细标准的解释请参看:W3C Editor's Draft)navigationStart:在同一个浏览器
阅读全文
摘要:babelrc 配置文件 polyfill 的意思 polyfill这个单词翻译成中文是垫片的意思,详细点解释就是桌子的桌脚有一边矮一点,拿一个东西把桌子垫平。polyfill在代码中的作用主要是用已经存在的语法和api实现一些浏览器还没有实现的api,对浏览器的一些缺陷做一些修补。例如Array新
阅读全文
摘要:Sublime Text 系列 Sublime Text:学习资源篇 Sublime插件:增强篇 Sublime插件:Markdown篇 Sublime插件:C语言篇 Sublime插件:主题篇 Sublime插件:Git篇 Sublime 小技巧:文本自动换行显示?
阅读全文
摘要:常用学习资源 JS参考与基础学习系列 [MDN]JS标准参考 es6教程 JS标准参考教程 编程类中文书籍索引 深入理解JS系列 前端开发仓库 《JavaScript 闯关记》 JavaScript 初学者教程(指南) JS讲义 李炎恢JavaScript教程 第一季 逐行分析jQuery源码的奥秘
阅读全文
摘要:记得年初的时候我给自己制定了一个学习计划,现在回顾来看完成度还不错。但仍有些遗憾,一些技术点没有时间去好好学习。 在学习中我发现,像文章这样的知识往往是碎片化的,而前端涉及到的面很多,如果不将这些知识有效梳理,则无法形成体系、相互串联。最后有一种东懂一块,西了解一点的感觉。因此,我结合工作体会抽象出
阅读全文
摘要:通过第三方 JavaScript 库,扩展微信小程序框架功能。 扩展微信小程序框架功能(1)——Promise ES6 对 Promise 有了原生的支持,但微信开发者工具更新版本(0.11.112200)后, 移除了开发者工具对 ES6 中Promise 特性原生的支持, 需要引入第三方的 Pro
阅读全文
摘要:1. 前后端分离 前端与后端的分离,能使前端的开发脱离后端的开发模式,拥有更大的自由度,以此便可做前端工程化、组件化、单页面应用等。 可以参考:前后端分离、web与static服务器分离(https://segmentfault.com/a/1190000015297319)。 2. 尽量避免后端模
阅读全文
摘要:什么是Babel The compiler for writing next generation JavaScript. 官网是这么说的,翻译一下就是下一代JavaScript 语法的编译器。 作为前端开发,由于浏览器的版本和兼容性问题,很多JavaScript的新的方法都不能使用,等到可以大胆使
阅读全文
摘要:数据驱动应该是从flux/redux + react这种模式开始流行的。 他的背后不仅仅是数据驱动这么简单,在复杂的系统中,我觉得它解决了一个很关键的问题就是模块间的交互/通信。有很多文章拿他和mvc/mvvm去比较,我个人觉得没有特别的可比性,因为解决的问题不同。 以往处理模式 一个稍微复杂点的例
阅读全文
摘要:亲爱的各位朋友们,大家下午好! 首先祝大家国庆节快乐! 很高兴可以在国庆前夕,可以为大家分享一下React风格的企业前端技术。 谈到前端,可能以前大家的第一感觉就是,前端嘛,无非就是做做页面切图,顶多加上CSS做做页面样式,或者JS做页面的交互、动画、特效等等。 其实,随着近几年前端的飞速发展,像组
阅读全文
摘要:简介 webpack作为当前最为流行的模块打包工具,几乎所有的主流前端开发框架(React、Vue等)都会将其作为默认的模块加载和打包工具。通过简单的配置项,使用各种相关的loader和plugin,我们就可以实现自动的模块依赖分析并打包,从而大大降低了前端项目的开发复杂度,明显提高了前端项目的开发
阅读全文
摘要:有人认为JavaScript是最好的语言,有人认为它一团糟。可按照C++之父的话来讲: 世界上只有两种编程语言:一种是天天被人喷的,另一种是没人用的。 不论你喜欢承认与否,JavaScript已经一天比一天火了,甚至火得有点过头,生态圈太过繁荣,每个月都可能有新的相关构建工具、开发框架或者别的什么库
阅读全文
摘要:流媒体本质上是:现实的图像,经过编码器压缩,持久化为点播文件或者直播流,经过传输,在终端解码和展示。 http live streaming(hls) 适用移动端HTTP Live Streaming(HLS)是苹果公司实现的基于HTTP的流媒体传输协议,可实现流媒体的直播和点播。原理上是将视频流分
阅读全文
摘要:1、常用工具相关 2、知识储备相关 3、移动Web相关 4、切页面相关 5、前端库/框架/插件相关 6、部署流程相关 7、帖子相关 8、H5案例相关 9、Node.js相关 10、AngularJS相关 11、Angular2相关 12、Ionic相关 13、Ionic 2相关 14、React N
阅读全文