20181020 前端开发日报-前端开发博客

前端工程化的个人思考；前端性能之JavaScript成本（2018）；js闭包探秘；我的前端面试总结（套路篇）；Deep In React（一）：高性能 React 组件；vue移动端5页面根据屏幕适配的四种方案；HTTP1.X、HTTP/2、websocket、http.Hijacker golang；Flexbox 布局的最简单表单

前端工程化的个人思考 17年写过一篇文章《野蛮生长的前端,从杂牌军到正规军》，当时是为了解决前端代码缓存问题延伸出来的，写那篇文章时，前端我是个门外汉。近一个月又读了两本关于前端架构、实践指导的书，有必要再来总结一下，当然，我还是个门外汉，之于前端似乎没什么长劲，前端专业人士可略过。在我的印象中，一提到软件…
前端性能之JavaScript成本（2018）关于原文原文是在Medium上面看到的，Chrome工程师Addy Osmani发布的一篇文章，这位的Medium上面的自我介绍里面有一句Passionate about making the web fast，和这篇文章的主体可以说非常契合了。最近在做一
js闭包探秘译者：闭包都被讨论烂了，不理解闭包都不好意思说自己会js，但我看到这篇文章还是感觉眼前一亮，也让我对闭包有了一些新的理解，并且涉及了一些类和原型链的知识，这是一篇2012年的文章，稍微有点早，内容也略微…
我的前端面试总结（套路篇）2018年的秋天，金九银十的秋招季，很荣幸，我也加入了跳槽求职的大部队,虽然招聘热潮没有每年年初那样疯狂，但是还是看得出很多公司都在大量的求贤，和以往的跳槽不同，这次我主要通过猎头去寻找面试机会，因为…
Deep In React（一）：高性能 React 组件 React在推向社区之初, 一个备受社区欢迎的点就是React的优秀的性能。得益于React出色的架构, React相比于传统的方式确实快很多。但是在实际开发中也存在着很多React性能的陷阱。虽然我们绝大多数时候其实不需要过于关心React的性能问题，但是当需要提升性能时，我们也会有一些很好的切入点去做这件事情. Rea…
vue移动端5页面根据屏幕适配的四种方案
HTTP1.X、HTTP/2、websocket、http.Hijacker golang 从Go 1.6开始， net/http 下提供的 Server 在调用 ListenAndServeTLS 函数启动https服务的情况下会自动支持HTTP/2。其会根据与客户端TLS握手阶段的ALPN扩展判断客户端是否支持HTTP/2(h2)，若支持，在TLS握手结束后会直接使用HTTP/2进行通讯。若需要使用HTTPS但不想开启HTTP/2可以有以下两种方法：初始…
《Flexbox 布局的最简单表单》弹性布局（Flexbox）逐渐流行，越来越多人使用，因为它写 CSS 布局真是太方便了。下面，你只需要10分钟，就可以学会简单的表单布局。（by 阮一峰）
无字母数字 webshell 之提高篇作者： @周佩雨前几天【代码审计知识星球】里有同学提出了一个问题，大概代码如下：这个代码如果要getshell，怎样利用？这题可能来自是我曾写过的一篇文章：…
不会git的程序员，会不会被鄙视？事先声明啊，这与公司技术栈无关，不要说有些公司只用 git 管理。对于公司而言，使用什么版本控制有一定的考虑或者历史原因。但如果你遇到一个不会 git 的新同事，会不会感觉 ta 以前的公司有点low ？
初学者可能不知道的vue技巧大家好，这里是@IT·平头哥联盟，我是首席甩锅官——老金，今天给大家分享的，一些日常中神秘而又简单的vue的实用小技巧，以及我在我司项目中实用vue的总结和坑，跟大家一起分享，希望能给其他攻城狮带来些许便利，…
js 函数节流和防抖js 函数节流和防抖 throttle 节流 {代码…} 应用场景触发mousemove事件的时候，如鼠标移动。触发keyup事件的情况，如搜索。触发scroll事件的时候，譬如鼠标向下滚动停止时触发加载数据。 coding 方法1 防…
学习react的心路历程（一）第一个点 `<script type=”text/babel”></script>
前端状态管理与有限状态机原文链接当下前端流行的框架，都是用状态来描述界面(state => view),可以说前端开发实际上就是在维护各种状态(state)，这已经成为目前前端开发的共识。 View = ViewModel(Model); 复制代码理想情况下，ViewMod
webpack-demos：全网最贴心webpack系列教程和配套代码Wow！全网最贴心的webpack4系列中文教程和配套代码。网速过慢的朋友请移步《webpack4 系列教程汇总》原文地址。更欢迎来我的小站看更多原创内容：godbmw.com，进行“姿势”交流 ♪(^∇^*)
IMWebConf 2018 圆满落幕，精彩内容回顾 2018年10月14日，第七届IMWebConf前端大会在深圳科兴国际会议中心成功举办。今年大会现场参会人员近500人，线上直播参与人数累积近千人。 IMWebConf 是由腾讯前端 IMWeb 团队发起的国内顶级前端技术领域开发者大会。今年大会依旧汇聚了许多
纯css实现Material Design中的水滴动画按钮这是谷歌Material Design中最常见的特效了，市面上也有很多现成的js库，用来模拟这一特效。但是往往要引入一大堆js和css，其实在已有的项目中，可能只是想加一个这样的按钮，来增强用户体验，这些js库就显得有些…
使 WebAssembly 更快：Firefox 的新流式和分层编译器原文地址：Making WebAssembly even faster: Firefox’s new streaming and tiering compiler 原文作者：Lin Clark 译文出自：掘金翻译计划本文永久链接：github.com/xit
JavaScript的数据类型及其检测Javascript有两种数据类型，分别是基本数据类型和引用数据类型。其中基本数据类型包括Undefined、Null、Boolean、Number、String、Symbol (ES6新增，表示独一无二的值)，而引用数据类型统称为Object对象，主要包…
从一道题解读JS原型链之前对js原型和原型链的理解一直觉得很绕，绕来绕去的，在看了《JavaScript高级程序设计》和各种文章之后，终于对原型和原型链有了初步的了解，可是还是没有很深入的了解，今次通过以前段时间遇到的一道题，分析…
记一次 VUE 项目优化实践爱康体检宝 PC（www.tijianbao.com/) 算是一个“老”项目，为什么说“老”呢，因为在前端技术日新月异，每天都有新知识、新概念，甚至新框架的今天，它还是基于vue-cli 2.x、webpack 3.x构建，显然有些老了。其次，在早期开始这个项目的时候，由于仓促上线，也没有过多的考虑性能及加载问题，目前网站上使用的图片未经过裁切…
Git的奇技淫巧Git是一个“分布式版本管理工具”，简单的理解版本管理工具：大家在写东西的时候都用过“回撤”这个功能，但是回撤只能回撤几步，假如想要找回我三天之前的修改，光用“回撤”是找不回来的。而“版本管理工具”能记录每次…
前端每日实战：158# 视频演示如何用纯 CSS 创作一个雨伞 toggle 控件效果预览按下右侧的“点击预览”按钮可以在当前页面预览，点击链接可以全屏预览。 [链接] 可交互视频此视频是可以交互的，你可以随时暂停视频，编辑视频中的代码。请用 chrome, safari, edge 打开观看。 [链接] …
网络协议之 – HTTP关于HTTP的知识比较繁杂，也比较零散，于是想要通过这篇文章对常用知识点进行总结，一些知识点描述是从网上搜集而来，如有侵权，可以联系我进行修改。
为什么ReasonReact是编写React的最佳方式原文地址：medium.freecodecamp.org/psst-heres-… 你是否使用 React 来构建用户界面？好吧，我也是。接下来你会了解为什么要使用 ReasonML 来写 React 应用。 React 是构建用户界面的一种很酷的手段，我们该
css3实现颤动的动画需求页面要做一个活动入口，不能太显眼，但是又要用户能一眼就看出来。演示 [链接] 实现（部分动画代码） {代码…} Github 代码 [链接] 另附一个 vue 搭建的后台管理另附一个 vue 搭建的后台管理 [链接]
Github Repository 可视化 (D3.js & Three.js)最初想法是因为 github 提供的页面无法一次看到用户的所有 repository, 也无法直观的看到每个 repository 的量级对比(如 commit 数, star 数),
The Cost Of JavaScript 2018 原文是在Medium上面看到的，Chrome工程师 Addy Osmani 发布的一篇文章，这位的Medium上面的自我介绍里面有一句 Passionate about making the web fast ，和这篇文章的主体可以说非常契合了。最近在做一个服务端渲染的项目，到底页面性能的提升能够带来多少的意义，或者到底有多少合理的方法来让精雕细琢移动…
Deep In React (一) 高性能React组件原文链接：hateonion.me/2018/10/17/… React的渲染机制在React内部，存在着初始化渲染和更新渲染的概念。初始化渲染会在组件第一次挂载时，渲染所有的节点当我们希望改变某个子节点时我们所期望React帮我们实现的渲染行为
【ECMAScript 2016/2017/2018新特性详解】要跟踪 JavaScript（ECMAScript）究竟提供了哪些新特性并不容易，找到有用的代码示例更加困难。在本文中，我将介绍在 ES2016、ES2017 和 ES2018 中添加的 18 个特性，并提供有用的示例。