JS基础及进阶

• 《Javascript 高级程序设计》至少完整读一遍，第一遍至少用一个月、最好三遍，。每一遍都会有不同的收获，对每一章内容尝试画出思维导图。
• 《你不知道的JavaScript》系列 英文原版 、 中文翻译版 对JS基础讲的很棒
• 现代 Javascript 教程
• web-fundamentals 谷歌官方Web相关精品文章
• ECMAScript 6 入门 阮老师的博客，入门挺好的
• 深入浅出E6 ES6 in Depth infoQ 翻译过来的内容，对ES6各个知识点进行了详解，英文原版在这里 ES6 In Depth Articles
• JavaScript Promise迷你书（中文版） Promise是JS中非常重要的编程思想
• 剖析Promise内部结构，一步一步实现一个完整的、能通过所有Test case的Promise类
• javascript garden 内容有些老了，依然是经典
• es6 学习总结
• Generator 函数的含义与用法
• 理解 JavaScript 的 async/await
• 体验异步的终极解决方案-ES7的Async/Await
• 传统 Ajax 已死，Fetch 永生
• 面向对象的JavaScript编程：原理与实践
• JavaScript标准参考教程 Ecmascript DOM BOM 基础
• 前端基础进阶系列
• 前端进阶博客
• es6-features.org
• 读书笔记-你不知道的JavaScript(上)
• 这一次，彻底弄懂 JavaScript 执行机制
• 深入理解javascript原型和闭包系列
• 深入理解浏览器渲染原理：Repaint, Reflow
• JavaScript 模块演化简史
• JavaScript是如何工作的：内存管理 + 如何处理4个常见的内存泄漏
• Canvas 最佳实践（性能篇）
• 非常有用的 48 个 JavaScript 代码片段
• JavaScript函数式编程指南
• JavaScript函数式编程
• javascript柯利化
• 采用MVC模式创建一个简单的javascript App
• 合格的前端系列
• 前端知识汇总
• Javascript有个Unicode的天坑
• ES6走走看看—字符到底发生了什么变化
• Unicode与JavaScript详解
• JavaScript内存泄露和CSS优化相关序列文章
• JavaScript深入系列
• 前端进阶系列
• base64原理浅析
• JavaScript Timers: Everything you need to know
• 前端博客
• 前端博客，关注基础知识和性能优化。
• js-dev-reads js 开发者书单，英文的
• 30-seconds-for-everyday
• overreacted.io Dan Abramov的个人博客，对React基础的东西进行了深入的介绍 中文翻译版
• 前端精读周刊 文章质量比较高，作者很有思考

Event Loop

• 深入理解 JavaScript Event Loop
• 从Promise来看JavaScript中的Event Loop、Tasks和Microtasks
• 菲利普·罗伯茨：到底什么是Event Loop呢
• Event loop in JavaScript
• 不要混淆nodejs和浏览器中的event loop
• Event Loop

前端库/框架

react （react 随着版本变更源码更新较快，有些设计变动较大，主要是理解思想吧）

• react 官网 官网中文版
• react 组件生命周期
• React教程
• React 性能优化大挑战
• 虚拟 DOM 内部是如何工作的
• IMMUTABLE 详解
• 重新设计 React 组件库
• 从工程化角度讨论如何快速构建可靠React组件
• 小前端读源码 - React16.7.0
• React 源码剖析系列 不可思议的 react diff
• 虚拟DOM Diff算法解析
• React 的 diff 算法
• react精髓之一---diff算法
• React 源码剖析系列 － 不可思议的 react diff
• react源码系列
• React 组件解耦之道
• 深入理解react（源码分析）
• React源码解析
• React 设计中的闪光点
• React 底层揭秘
• 40 行代码内实现一个 React.js
• 小前端读源码 - React16.7.0
• [译]深入React fiber架构及源码 、浅析React Diff 与 Fiber 、 [译]深入React fiber 链表和DFS

vue

• Vue -渐进式JavaScript框架
• 读懂源码：一步一步实现一个 Vue
• Vue 源码注释版 及 Vue 源码详细解析
• Vue原理解析之Virtual Dom
• Vue原理解析之observer模块
• vue源码解析系列
• vue源码分析
• Vue技术内幕逐行级别的 Vue 源码分析
• Vue.js 技术揭秘

小程序开发

• 官方文档
• mpvue 基于 Vue.js 的小程序开发框架
• WePY | 小程序组件化开发框架

jQuery

• jQuery源码解析（架构与依赖模块）
• jQuery源码解析（DOM与核心模块）
• 【深入浅出jQuery】源码浅析--整体架构
• 【深入浅出jQuery】源码浅析2--奇技淫巧

lodash/underscore(这两个框架功能一样实现不同)

• underscore中文文档
• underscore英文文档
• Underscore源码解析1
• Underscore源码解析2
• Underscore源码解析3
• Underscore源码解析4
• underscore-1.8.3.js 源码解读 & 系列文章

图表可视化

• echart

状态管理库

• redux
• vuex
• Vuex 学习总结
• mobx

webpack

• 入门Webpack，看这篇就够了
• webpack中文文档
• Webpack 教程
• 使用 webpack3 配置多页应用
• 深度解析create-react-app源码
• React配合Webpack实现代码分割与异步加载
• 前端面试之webpack篇
• webpack面试题有哪些

设计模式

• JavaScript设计模式
• 常用的javascript设计模式

HTTP

• 《图解http》 《图解TCP/IP》 《web性能权威指南》
• 浏览器HTTP缓存机制
• Cookie/Session机制详解
• 浅谈Web缓存
• 我知道的跨域与安全
• 你知道一次HTTP请求响应涉及了哪些知识吗？
• HTTP状态码->HTTP Status Code
• Https的前世今生
• 一篇文章带你详解 HTTP 协议（网络协议篇一） 一篇文章带你熟悉 TCP/IP 协议（网络协议篇二）

前端监控 与性能优化 浏览器原理

• 从输入 URL 到页面加载完成的过程中都发生了什么事情？
• 浏览器工作原理：从 URL 输入到页面展现到底发生了什么？ 、 浏览器的工作原理：新式网络浏览器幕后揭秘 、What really happens when you navigate to a URL
• 输入url之后 流程图
• 图解浏览器的工作原理
• 从无到有 <前端异常监控系统 > 落地
• 使用HMTL5 API监控前端性能
• 浏览器端JS异常监控探索与实践
• 前端数据监控到底在监控什么？

NodeJS

• Node进阶

• Node.js调试指南

• 深入浅出NodeJS

• nodeJS 学习笔记

• Node.js 知多少

• express

• koa进阶学习

• NodeJS调试指南

• Node.js 子进程：你需要知道的一切

• 《深入理解Node.js：核心思想与源码分析》

• 使用 Google V8 引擎开发可定制的应用程序

• node源码详解

• Node.js挖掘

• node 源码粗读系列

• Node.js 流: 你需要知道的一切

• Node.js 子进程：你应该知道的一切

WebAssembly

• 来谈谈WebAssembly是个啥？为何说它会影响每一个Web开发者
• WebAssembly 系列（一）生动形象地介绍 WebAssembly
• WebAssembly 系列（二）JavaScript Just-in-time (JIT) 工作原理
• WebAssembly 系列（三）编译器如何生成汇编
• WebAssembly 系列（四）WebAssembly 工作原理
• WebAssembly 系列（五）为什么 WebAssembly 更快？
• WebAssembly 系列（六）WebAssembly 的现在与未来
• WebAssembly 那些事儿
• 《C/C++面向WebAssembly编程》——Emscripten工程实践
• WebAssembly(wasm)资源精选
• WebAssembly 后 MVP 时代的未来：卡通技能树
• 在 JavaScript 和 WebAssembly 之间调用执行速度终于快了
• WebAssembly 系列（第一部分） - 用卡通形式介绍 WebAssembly
• WebAssembly 系列（第二部分） - 即时编译器（JIT）速成课
• WebAssembly 系列（第三部分） - 汇编（assembly）速成课

TypeScript

• 深入理解TypeScript
• TypeScript Handbook（中文版）
• typescript入门教程

Go

• GO高级语言编程
• Go语言圣经中文版
• 《Go语言四十二章经
• 《Go 入门指南》 《The Way to Go》中文译本

hybrid

• Hybrid APP基础篇(一)->什么是Hybrid App
• Hybrid APP基础篇(二)->Native、Hybrid、React Native、Web App方案的分析比较
• Hybrid APP基础篇(三)->Hybrid APP之Native和H5页面交互原理
• Hybrid APP基础篇(四)->JSBridge的原理*
• 浅谈Hybrid技术的设计与实现
• 浅谈Hybrid技术的设计与实现第二弹
• 浅谈Hybrid技术的设计与实现第三弹——落地篇
• Hybrid App技术解析 -- 原理篇
• Hybrid App技术解析 -- 实战篇
• 【quickhybrid】如何实现一个Hybrid框架
• 聊一聊 WebView 与 JS 交互方案 - 适用 Android & iOS

react native

• 如何评价reactnative
• ReactNative源码篇

Flutter

• http://flutter-dev.cn/
• https://flutter-io.cn/
• https://flutterchina.club/
• https://juejin.im/tag/Flutter
• SDK
• Flutter 跨平台移动应用开发实战
• awesome-flutter
• flutter-community
• FLutter实战

数据结构和算法

• 算法基础(算法基础)
• Leetcode 题解
• 剑指Offer——名企面试官精讲典型编程题
• 七月在线算法公开课
• 编程之法
• 数据结构和算法 掌握线性表(队列、栈、链表)，二叉树,了解多叉树和图
• javascript-algorithms
• LeetCode with Javascript
• awesome-algorithm
• 每日一道算法题
• 记录前端开发中的技巧以及算法知识
• 《挑战程序设计竞赛》习题册攻略
• 记录各种学习笔记(算法、Java、数据库、并发......)
• leetcode题解博客 一个大神的刷题博客
• 花花酱LeetCode LeetCode刷题视频
• 用动画的形式呈现解LeetCode题目的思路
• 刷题博客 博客园的刷题系列博客
• 推荐微信公众号 算法爱好者 、五分钟学算法

其他工具

• Chrome 开发者工具使用
• GitHub&Git入门基础 版本管理工具介绍—Git篇
• 移动应用抓包调试利器Charles
• Linux达人养成计划I
• Linux 达人养成计划 II
• Linux Guide for Developers
• vi编辑器的使用
• nginx 初始
• nginx 基本入门
• Nginx 的缓存配置与其他配置
• caniuse jsperf Can I Use是一个检测浏览器对JS、HTML5、CSS、SVG或者其他Web前端相关特性支持程度的列表。可以检测的浏览器包括桌面和移动版的主流浏览器：IE, Firefox, Chrome, Safari和 Opera等 你可以从列表中直接查看某个特性相关的浏览器支持程度，或者搜索
• 使用Benchmark.js和jsPerf分析代码性能
• Wireshark wireshark 分析协议的工具，对理解基础协议有很大帮助
• Web安全学习笔记

CSS

• 移动前端开发之viewport的深入理解
• 使用Flexible实现手淘H5页面的终端适配
• 再聊移动端页面的适配
• 通过动图形象地为你介绍 flexbox 是如何工作的
• CSS像素、物理像素、逻辑像素、设备像素比、PPI、Viewport #21
• 【原创】移动端高清、多屏适配方案

单元测试

• Node.js 单元测试：我要写测试
• 测试框架 Mocha 实例教程
• 用Mocha和Chai对JavaScript进行单元测试
• 理解前端开发中的 unit test 和 e2e test
• E2E 测试之 Cypress
• Puppeteer: 更友好的 Headless Chrome Node API
• headless浏览器 Puppeteer 初探

面试

• 写给前端面试者

• 面试必备基础知识 CS-Notes

• 前端面试题整理（定期更新

• 各大互联网公司前端笔试面试题–HTML,CSS篇

• 前端 2018 届校招笔试面经【百度，阿里，腾讯，阿里文娱，携程，美团，拼多多】

• 前端面试那些坑之HTML篇

• 前端面试题整理

• web前端面试题整理（CSS篇）

• 大厂前端面试考什么

• 2017年秋季校招前端面经（百度，腾讯，网易，华为，乐视等）

• 2018春招前端面试: 闯关记

• 轮播实现

• 2019年前端面试都聊啥？一起来看看

• 图片懒加载、按需加载 网页图片加载优化方案

• 前端路由实现原理

• 双向绑定实现

• margin折叠

• 观察者模式实现(事件模式)

• 实现 querystring 解析

• fastclick 原理

    var str = 'foo=bar&abc=xyz&abc=123';
    querystring.parse(str)
    // { foo: 'bar', abc: [ 'xyz', '123' ] }
  

• 函数节流 7 个基本的 JS 函数

• 50道CSS基础面试题

• CSS 一像素解决方案

• Promise 实现

• 使用Vue的nextTick引发的执行顺序之争

• JavaScript 异步、栈、事件循环、任务队列

• BAT及各大互联网公司2014前端笔试面试题--JavaScript篇

• 编程面试的10大算法概念汇总

• 前端面试——css篇

• 算法 快速排序、判断回文、数组去重、寻找最长回文串、判断一个数是不是2的幂

• 前端常见算法

• 剑指offer算法题

• 全排列 全排列

• 征服JavaScript面试系列：类继承和原型继承的区别

• 只有20行Javascript代码！手把手教你写一个页面模板引擎

• 前端面试之webpack篇

• webpack面试题有哪些

• 牛客网前端面经

• Front End Interview Handbook

• 面试题

• 2018大厂高级前端面试题汇总

• InterviewMap

• 前端开发中的技巧以及算法知识

• 前端题库

• reactjs-interview-questions

• 每天一道前端大厂面试题

• https://github.com/airuikun/Weekly-FE-Interview

web性能优化

正则表达式

• 正则表达式30分钟入门教程
• https://regexr.com/
• JavaScript正则进阶之路——活学妙用奇淫正则表达式
• 正则表达式-MDN

其他

• DOM 导图

• BOM API

Reactive

• What is Reactive Programming?
• Functional Reactive Programming
• 响应式编程介绍
• Reactive编程（一）:Reactive编程的背景
• Reactive编程（二）:代码演示
• Reactive编程（三）:一个简单的HTTP服

RX.js

• RxJS 入门指引和初步应用
• 通俗的方式理解RxJS
• RxJS: 简单入门
• Rxjs--基础篇
• RXJS详解
• 构建流式应用—RxJS详解
• 异步事件管理：从Promise与async/await到RxJS

系统设计

• 系统设计入门

• DOM 继承关系

浏览器缓存

• 性能优化

CS基础系列

基础书籍推荐

• 深入理解计算机系统
• 操作系统之哲学原理
• 图解TCP/IP
• 算法导论
• web性能权威指南
• 人类简史
• 未来简史
• 系统化思维导论
• 代码整洁之道
• 从小工到专家 程序员修炼之道
• 重构
• 设计模式 GOF
• 数学之美
• 编程之美
• 系统架构