前端基础
这一次，彻底弄懂 JavaScript 执行机制
本文的目的就是要保证你彻底弄懂javascript的执行机制，如果读完本文还不懂，可以揍我。 不论你是javascript新手还是老鸟，不论是面试求职，还是日常开发工作，我们经常会遇到这样的情况：给定的几行代码，我们需要知道其输出内容和顺序。因为javascript是一门单线程…
浏览器的渲染：过程与原理
内容说明本文不是关于浏览器渲染的底层原理或前端优化具体细节的讲解，而是关于浏览器对页面的渲染——这一过程的描述及其背后原理的解释。这是因为前端优化是一个非常庞大且零散的知识集合，一篇文章如果要写优化的具体方法恐怕只能做一些有限的列举。然而…
浅谈前端线上部署与运维
说到前端部署，可能大多数前端工程师在工作中都是使用的公司现成的部署系统，与SRE对接、一起完成前端的部署操作。如果我现在给你一台新注册的云主机，那么你应该怎么做才能把一个前端工程部署到一台云主机上，成为一个可以访问的网页呢？今天我们就来聊聊前端的部署~ 首先，一个前端工程要变成…
给前端同学的最后一份CDN秘籍
每位工程师都应该了解的CDN
前端需要了解的 SSO 与 CAS 知识
不管是什么公司，只要产品数量大于一个，那么单点登录势必是绕不过去的一个问题。作为前端程序员，我们对其虽然接触不多，但适当的了解还是必要的。本文就来谈谈单点登录相关的问题。 了解 SSO，最好具备以下知识。当然，如果不是特别熟，也不影响阅读。 SSO 是英文 Single Sig…
JavaScrip同步、异步、回调执行顺序之经典闭包setTimeout分析
同步，异步，回调，我们傻傻分不清楚，
有一天，你找到公司刚来的程序员小T，跟他说：“我们要加个需求，你放下手里的事情优先支持，我会一直等你做完再离开”。小T微笑着答应了，眼角却滑过一丝不易觉察的杀意。
世界上的所有事情大致可以分为同步去做和异步去做两种。你打电话去订酒店，电话另…
30分钟，让你彻底明白Promise原理
前一阵子记录了promise的一些常规用法，这篇文章再深入一个层次，来分析分析promise的这种规则机制是如何实现的。ps:本文适合已经对promise的用法有所了解的人阅读,如果对其用法还不是太了解，可以移步我的上一篇博文。 为了让大家更容易理解，我们从一个场景开始讲解，让…
TCP的三次握手四次挥手
相对于SOCKET开发者,TCP创建过程和链接折除过程是由TCP/IP协议栈自动创建的.因此开发者并不需要控制这个过程.但是对于理解TCP底层运作机制,相当有帮助. 因此在这里详细解释一下这两个过程。 TCP/IP协议的详细信息参看《TCP/IP协议详解》三卷本。下面是TCP报…
原生 js 实现前端路由
最近一直在研究前后端分离，ajax 可以很好的解决前后端分离的问题，但是又存在着浏览器无法前进后退，这个问题比较尴尬。但是采用前端路由的方式可以很好的解决这个问题。这篇文章主要是介绍了前端路由的两种实现手段，并用原生的 Js 对其分别进行了实现。
谈谈关于前端的缓存的问题
我们都知道对页面进行缓存能够有利于减少请求发送，从而达到对页面的优化。不过在我前端工作的生涯中一直以为前端就是写写页面，写写交互，就已经很了不起，这种没有志向的想法发导致我日后的工作一直处于瓶颈。做人嘛总要有梦想嘛，不然跟一条咸鱼有什么区别。最近我一直在关于前端优化的问题，原来…
把cookie聊清楚
什么是有效期，就是图中的Expires属性，一般浏览器的cookie都是默认储存的，当关闭浏览器结束这个会话的时候，这个cookie也就会被删除，这就是上图中的——session(会话储存)。 Max-Age，是以秒为单位的，Max-Age为正数时，cookie会在Max-Ag…
Promise 必知必会（十道题）
Promise 想必大家都十分熟悉，想想就那么几个 api，可是你真的了解 Promise 吗？本文根据 Promise 的一些知识点总结了十道题，看看你能做对几道。 以下 promise 均指代 Promise 实例，环境是 Node.js。 解释：Promise 构造函数是…
从项目谈起，为何要用async / await 替代Promise？
async / await 替代Promise的几大理由
[译]一个100行内的现代js路由
(这个js路由现在被放项目Navigo中。这里还有一篇你可能会感兴趣的文章Deep dive into client-side routing) 现今到处都是流行的单页面应用（SPA）。这样的应用需要一个坚实的路由机制。像Emberjs这样的框架确实是在建立在一个路由类上的。我…
还担心面试官问闭包？
为什么我们需要理解并且掌握闭包，且不说大道理，就问你要不要成为JavaScript高手？不要？那你要不要面试找工作嘛。。。 再者，对于任何一个前端er或者JavaScript开发者来说，理解闭包可以看做是另一种意义上的重生。闭包是纯函数编程语言的一个特性，因为他大大简化复杂的操…
[翻譯] Modern Javascript Cheatsheet 中文版
本文檔整理了各種現代化 JavaScript 開發過程中經常使用到的腳本。
該份指南的目標並不是放在幫助初學者從零基礎到入門，而是為了幫助那些因為 Javascript 新式語法導致可能很難熟悉現代函數庫使用方式 (以 React 做為舉例) 的開發人員。
精读《JS 中的内存管理》
我为什么要选这篇文章呢？
sessionstack最近接连发了好几篇文章, 深入探讨JS, 以及 JS 中一些内部原理. 文中也讲到了, 伴随深入了解 JS 中的一些工作原理, 才有可能写出更好的代码和程序. 而 JS 中的内存管理, 我的感觉就像 JS 中的一门副科, 我们…
深入贯彻闭包思想，全面理解JS闭包形成过程
写这篇文章之前，我对闭包的概念及原理模糊不清，一直以来都是以通俗的外层函数包裹内层....来欺骗自己。并没有说这种说法的对与错，我只是不想拥有从众心理或者也可以说如果我们说出更好更低层的东西，逼格会提升好几个档次。。。
谈起闭包，它可是JavaScript两个核心技术之一(异步…
基于 Docker 打造前端持续集成开发环境
本文将以一个标准的 Vue 项目为例，完全抛弃传统的前端项目开发部署方式，基于 Docker 容器技术打造一个精简的前端持续集成的开发环境。 1. CI（持续集成）：阮一峰老师的关于 CI 的介绍 2. Docker： Docker 快速入门 1. 代码无需在本地构建 2. 只…
解锁Charles的姿势
Charles，作为mac开发的好基友，不知道大家是否对它的使用姿势了如指掌。相信很多童鞋只是熟悉几种简单的功能，今天为大家解锁几种高级姿势......希望能够帮到大家。 Charles是个啥，相信大家都会知道，如果真有不知道的，请百度之... ... 还有很多场景就不一一介绍…
【译】JavaScript 如何工作：对引擎、运行时、调用堆栈的概述
PS: 好久没写东西了，最近一直在准备写一个自己的博客，最后一些技术方向已经敲定了，又可以开心的学习了，node系列后续再开始。 随着JavaScript越来越流行，越来越多的团队广泛的把JavaScript应用到前端、后台、hybrid 应用、嵌入式等等领域。 这篇文章旨在深…
你还要我怎样的JS(2)
当你熟悉了上一篇提到的内存空间之后。我们再来接着梳理我们的JS轴线。JS好比是易筋经，学透彻了这门功夫，在茫茫快速迭代的前端海洋就有了本源核心，剩下的就是踩坑捡秘籍，打怪娶萧熏儿了。
内存空间是入门心法，教会我们怎么运用自身的丹田来存储气息，下一步就应该是学会怎么将气息顺着经脉…
一篇文章带你熟悉 TCP/IP 协议（网络协议篇二）
同样的，本文篇幅也比较长，先来一张思维导图，带大家过一遍。 不难看出，TCP/IP 与 OSI 在分层模块上稍有区别。OSI 参考模型注重“通信协议必要的功能是什么”，而 TCP/IP 则更强调“在计算机上实现协议应该开发哪种程序”。 1. TCP/IP 的具体含义 从字面意义…
程序员都该懂点 HTTP
HTTP 全称是 HyperText Transfer Protocal ，即：超文本传输协议，从 1990 年开始就在 WWW 上广泛应用，是现今在 WWW 上应用最多的协议，HTTP 是应用层协议，当你上网浏览网页的时候，浏览器和 web 服务器之间就会通过 HTTP 在 …
Q：你了解异步编程、进程、单线程、多线程吗？
同步：一个进程在执行某个请求的时候，若该请求需要一段时间才能返回信息，那么这个进程将会一直等待下去，直到收到返回信息才继续执行下去。 异步：进程不需要一直等下去，而是继续执行下面的操作，不管其他进程的状态。当有消息返回时系统会通知进程进行处理，这样可以提高执行的效率。 进程：狭…
妈妈再也不用担心我不会webpack了
webpack前端工程中扮演的角色越来越重要，它也是前端工程化很重要的一环。本文将和大家一起按照项目流程学习使用wbepack，妈妈再也不用担心我不会使用webpack，哪里不会看哪里。这是一个由浅入深的文章。 现在vue、react等脚手架都会自动将开发环境使用的webpac…
【JS】装饰器让你的代码更简洁
当我们在使用JavaScript时，有时需要用到setTimeout函数来强制代码延迟运行。比如： 我很讨厌这样写代码，我希望它变得简洁，所以我们可以把setTimeout函数抽象成装饰器。 这里我们需要传入一个数值作为参数（默认为0），所以我们需要使用装饰器工厂模式。 接下来…
第一本 PWA 中文书
此书献给广大 PWA 爱好者 带你领略 PWA 的强大与优雅
仅供大家学习使用 请勿用于任何商业用途
全书一共12章 目前已经翻译了前6章 持续更新中 希望大家多多关注
来聊一聊浏览器渲染
对于web前端开发者，浏览器再熟悉不过了。我们可能都知道浏览器含有一个渲染引擎，浏览器会根据 HTML文件来进行解析与渲染，最终再将页面呈现在用户面前。但是其具体的渲染原理和流程估计也有很多同学不清楚。然而前端开发者很有必要了解浏览器的工作工作机制。
高效使用 JavaScript 闭包
在 Node.js 中，广泛采用不同形式的闭包来支持 Node 的异步和事件驱动编程模型。通过很好地理解闭包，您可以确保所开发应用程序的功能正确性、稳定性和可伸缩性。
前端本地文件操作与上传
第一种是最常用的手段，通常还会自定义一个按钮，然后盖在它上面，因为type="file"的input不好改变样式。如下代码写一个选择控件，并放在form里面： 可以看到文件的路径是一个假的路径，也就是说在浏览器无法获取到文件的真实存放位置。同时FormData打印出来是一个空的…
HTML5 进阶系列：文件上传下载
前言 HTML5 中提供的文件API在前端中有着丰富的应用，上传、下载、读取内容等在日常的交互中很常见。而且在各个浏览器的兼容也比较好，包括移动端，除了 IE 只支持 IE10 以上的版本。想要更好地掌握好操作文件的功能，先要熟悉每个API。 FileList 对象和 file …
玩转异步 JS ：async/await 简明教程（附视频下载）
在软件开发领域，简洁的代码 => 容易阅读的代码 => 容易维护的代码，而 ES2017 中的 async/await 特性能让我们编写出相比回调地狱和 Promise 链式调用更直观、更容易理解的代码，await 关键字接收一个 Promise，等待代码执行，直到 Promi…
继microtask后，再谈event loop
关于event loop的详细理解
理解 Web 路由 - syaning
在 Web 开发过程中，经常会遇到『路由』的概念。那么，到底什么是路由？简单来说，路由就是 URL 到函数的映射。
Javascript异步编程模型进化
最近在看js的异步模型演化, 发现了一篇很好的文章, 忍不住分享
Promise 异步流程控制
然而能全部答上的很少，能够给出一个回调 + 计数版本的，我都觉得合格了。那么接下来就一起来学习总结一下基于 Promise 来处理异步的三种方法。 最简单的，就是将异步一个个来处理，转为一个类似同步的方式来处理。 先来简单的实现一个单个 Image 来加载的 thenable …
前端路由一探
比较全面的阐述了前端路由的特点和实现方式，以及和后端路由的区别
HTTP 缓存机制一二三
Web 缓存大致可以分为：数据库缓存、服务器端缓存（代理服务器缓存、CDN 缓存）、浏览器缓存。浏览器缓存也包含很多内容： HTTP 缓存、indexDB、cookie、localstorage 等等。这里我们只讨论 HTTP 缓存相关内容。 在具体了解 HTTP 缓存之前先来…
