preface

As long as one year, can win each big factory offer!!

typescript

  • TypeScript for the first time
  • Probably the 50 react + typescript specs and experience you need

CSS

  • Does CSS load block
  • Incredible pure CSS scrolling progress bar effect
  • 1010 Ways to implement horizontal and vertical centralization of CSS
  • Rem layout parsing
](https://juejin.cn/post/6844903671143088136)
Copy the code
  • Thoroughly understand CSS cascading context, cascading hierarchy, cascading order, and Z-index
  • Does CSS load block?
](https://juejin.cn/post/6844903667733118983?utm_source=gold_browser_extension)
Copy the code
  • 8 Tips for CSS Performance optimization
  • Personal Summary (CSS3 new features)
  • Summary of middle CSS Settings – Super complete
  • Web developers need to know CSS Tricks
  • CSS Tips

Front-end Engineering (Architecture, soft power)

  • Front-end caching best practices
  • Architecture article for the front-end (1) : MVC VS Flux
  • Front-end data validation starts with modeling
](https://juejin.cn/post/6844903667414335501)
Copy the code
  • Site performance optimization – from 12.67s to 1.06s story
  • 5 minutes for a front-end performance monitoring tool
  • Browser page resource loading process and optimization
  • Modernization lazy loading way
](https://juejin.cn/post/6844903559599751175)
Copy the code
  • Front-end data structures and algorithms
  • Why do front-end engineers learn compilation principles?
  • Jsonp principle and implementation
  • Lazy loading and preloading
  • 50 lines of MVVM, feel the art of closures
](https://juejin.cn/post/6844903619808985095)
Copy the code
  • Do the best front-end monitoring
  • How to gracefully handle front-end exceptions
](https://zhuanlan.zhihu.com/p/51800345)
Copy the code
  • Thinking and practice of front-end isomorphic rendering
  • Front-end build tips
  • Brief Introduction to front-end Architecture of Large Projects
  • A self-inspection list of a [qualified] front end engineer

The React technology stack

  • React source code
  • React family bucket framework from scratch
  • Get the virtual DOM and dom-diff out of your way
](https://juejin.cn/post/6844903806132568072)
Copy the code
  • Experience the design idea of React team from the discussion of setState promise
  • React App Design tips – Curry the way
  • How do you evaluate React’s new features Time Slice and Suspense?
  • React Engine — What is React Fiber
  • React source code: unqueue transactions and update queues
  • The React of the Transaction
  • React Transition React Transition
](https://zhuanlan.zhihu.com/p/20419592)
Copy the code
  • Optimized the React application to 60fps
  • How to write better React code?
  • Optimization practices for React mid-sized projects
  • React Source Code Analysis series – The art of managing the lifecycle
  • Deep into the React lifecycle (Part 1) : The Birth Stage (Mount)
  • Deep into the React lifecycle (2)
  • Do you really understand React (1) how to design components and important life cycles
](https://zhuanlan.zhihu.com/p/27828773)
Copy the code
  • React Ref’s past life
  • Talk about keys in React
  • React Mixin’s past life
  • Do you really understand React (middle) communication between components and React optimization
  • In-depth framework source series – Virtual Dom
](https://juejin.cn/post/6844903615652610055)
Copy the code
  • In-depth framework origin series – Virtual Dom
  • React Diff – React Diff
  • Shallow entry and shallow exit diagram domDIff
  • In-depth analysis: How to implement a Virtual DOM algorithm
  • React source code analysis series – Decrypt setState
  • The secret of the setState
  • What happened after setState
  • Do you really understand setState?
  • High-order components in React and their application scenarios
  • React Best Practices
  • Fully understand React Fiber
  • The React Fiber architecture
  • React Fiber Architecture Overview
  • You don’t know about the Virtual DOM series
  • Learn the React function component from the Recompose library
  • React-redux source code analysis
  • React setState
  • React setState
  • Implementing a React with 160 lines of JAVASCRIPT
  • Still using Redux, why don’t you try GraphQL and Apollo
  • React isomorphism Practice and Thinking
  • React implements Table thinking
  • React practice – Component Generator
  • ReactEurope 2016
  • ReactEurope 2016
  • The realization principle of Mobx idea, and comparison with Redux
  • Component Library Design Practice – Complex component design
  • Redux middleware,
  • In-depth understanding of the React-Router routing system
  • Immutable; React; Immutable
  • React-redux source code analysis

webpack/babel

  • Webpack source (a) – Tapable and event stream
  • Hand by hand teach you a Webpack Loader
  • Interviewer: Have you heard about Babel? Have you ever written a Babel plug-in? A: No. pawn
  • Write Better JavaScript With Webpack
  • Hand by hand teach you a simple Webpack
  • Take you into the webpack world, become the number one Webpack player
  • Webpack after the file is too large solution
](https://juejin.cn/post/6844903569917739021)
Copy the code
  • Build React development environment based on Webpack
  • Getting started with Babel – Implements an ES6 class converter
  • The 5 most confusing points in webpack
  • 14 facts about webpack4, honestly

Test

  • The rules in ESLint taught me not to program without rules

JavaScript

  • Publish and subscribe is more powerful at work than you think
  • Who says the front end doesn’t need to understand -Nginx reverse proxy with load balancing
](https://juejin.cn/post/6844903619465068551)
Copy the code
  • WebSocket it’s time to show your best side
  • Socket. IO allows anyone to develop their own im
  • How does WebSocket work? Why can persistent connection be implemented
  • How JavaScript works: An overview of the engine, runtime, call stack
  • Understand the execution context and execution stack in JavaScript
  • 33 Concepts JavaScript Developers should Know
  • Front-end JS string/picture/Excel file download
  • A more elegant way to write complex JavaScript judgments
  • Sexy Promise. Hug him and strip him
  • Nearly 10,000 words ES6 grammar knowledge supplement
  • The ultimate quest for deep copy (90% of people don’t know)
  • Basic principles of front-end route jumping
  • Nine cross-domain implementation principles
  • Discover the power of closures in JavaScript
  • You may not be familiar with the JS summary
  • The magic of higher-order functions in JavaScript
](https://juejin.cn/post/6844903668651819016)
Copy the code
  • AST Abstract Syntax tree – one of the most basic javascript essentials that 99% of people don’t know at all
  • ES6, ES7, and ES8 features are stewed in one pot
  • How to use arrays better in JavaScript
  • 7 minutes to understand the throttling, anti-shaking and application scenarios of JS
  • ECMAScript 6 Cet 6
  • Javascript: Airbnb javascript code specification
  • Promise implementation principle (attached source code)
](https://juejin.cn/post/6844903665686282253)
Copy the code
  • Some JavaScript code tips
](https://juejin.cn/post/6844903663492661262)
Copy the code
  • Understanding the Beauty of Asynchrony — Promise and Async await (iii)
  • ES9 has arrived. Are you ready?
  • Build a state management system using native JavaScript
  • I Promise I will (10 questions)
](https://juejin.cn/post/6844903509934997511)
Copy the code
  • Write your own code base (implementation and encapsulation of common javascript instances)
  • Import, require, export, module.exports
  • WebSocket: 5 minutes from beginner to master
  • JavaScript operation principle analysis
  • Learn a little about JavaScript garbage collection
  • Remember js’s 6 regular methods at once
  • Several JS code handwritten problems and some code implementation
](https://juejin.cn/post/6844903575559077895)
Copy the code
  • Interviewer: Do you know anything about front-end routing?
](https://juejin.cn/post/6844903589123457031)
Copy the code
  • The underlying mechanics of JavaScript closures
  • Multithreading in JavaScript – Web Workers
  • Unlock multiple JavaScript arrays to go heavy poses
  • Promise won’t…? Look here!! The most accessible Promise ever!!
  • Brief introduction to the realization principle of Instanceof and Typeof
  • 1. Write A Promise that Promises/A+ Promises from scratch
  • Front-end performance related: anti – shake, throttling
  • There are seven ways to implement array de-duplication
  • How to implement an HTTP request library — AXIos source code reading and analysis
  • Interviewer: React/Vue can communicate with components using Event Bus. Can you implement this?
  • Higher order function, how can you be so beautiful!
  • Interviewer: Please implement a deep clone
  • Front-end modularity: CommonJS,AMD,CMD,ES6
](https://juejin.cn/post/6844903576309858318)
Copy the code
  • Promise principle explains && Implement a Promise object
  • HTTP/2 Server Push
](https://zhuanlan.zhihu.com/p/26757514)
Copy the code
  • A more elegant way to write complex JavaScript judgments
  • I never understood JavaScript closures until someone explained it to me this way
  • Rediscover constructors, stereotypes, and stereotype chains
](https://juejin.cn/post/6844903779079290887)
Copy the code
  • Use Proxy to track JavaScript classes
  • “Advanced front-end interview” JavaScript handwritten code unbeatable secrets
](https://juejin.cn/post/6844903809206976520)
Copy the code
  • Interviewer (6): Did you write “Common front-end components”?
  • Sorry, Proxy learning can really do whatever it wants
  • 28 JavaScript Skills an Intermediate Front-end Engineer must Master
  • Front-end routing principle analysis and implementation
  • Don’t memorize regular expressions
  • The front end must know will – the black technology that operates the URL
  • 43 JavaScript interview questions for you

Node

  • Build your NodeJS body of knowledge in one article
  • More than 200 lines of code to implement the Websocket protocol
  • What’s the difference between browser and Node Event loops
  • NodeJS and the module system

Flutter

  • Flutter Action Video – Mobile e-commerce
  • Implementation principle of EVENT_bus in FLUTTER
  • Flutter interview tips

Http

  • Design an airtight browser caching solution: About ideas, details, ServiceWorker, and HTTP/2
  • The front end you should know about — caching
  • HTTP caching mechanism one two three
](https://zhuanlan.zhihu.com/p/29750583)
Copy the code
  • Perform various operations using HTTP headers
  • Nine questions from getting started to getting familiar with HTTPS
  • Talk about the HTTPS
  • Interview with you: this is a comprehensive summary of the basics of computer networking
](https://juejin.cn/post/6844903592965439501)
Copy the code
  • Look at the picture to learn HTTPS
  • A minute to understand HTTPS
  • Little brother, little sister, I have a TCP, HTTP interview guide do you want?
  • HTTP2 Basic concepts study notes
](https://juejin.cn/post/6844903589635162120)
Copy the code
  • HTTP protocol for front-end basics
  • What is the interviewer trying to ask us about three handshakes and four waves
  • What you must Know about Web security
](https://juejin.cn/post/6844903842635579405)
Copy the code
  • You may still be confused about require, import and export

The browser

  • The front-end must understand the browser caching mechanism
  • Reflow & Repaint for browsers
  • Simple browser rendering
](https://zhuanlan.zhihu.com/p/53913989)
Copy the code

The interview

  • The three most frequently asked Javascript interview questions!
  • Crack the front-end interview (80% fail series) : Start with DOM
  • Interview confidence comes from a solid foundation
  • Classic INTERVIEW Questions: The most detailed handwritten Promise tutorial ever
  • Cracking the front-end interview (80% fail series) : Start with closures
  • JS interview questions that 80% of applicants fail
  • Learn the Event Loop once (Solve these interview questions once and for all)
](https://juejin.cn/post/6844903764202094606)
Copy the code
  • A basic problem ignored by the front end, do not believe you will see a few questions
  • Tencent school recruit front three, abuse continue to masturbation
  • 2018 Alibaba front-end interview summary
  • Several advanced front end questions analysis
  • 26 selected JavaScript interview questions
  • Summary of high-frequency interview questions and answers

Data structures and algorithms

  • Front-end written test & interview climb pit series – algorithm
  • Comics: What is a red black tree

other

  • How do Web projects conduct Git collaborative development
  • Chrome plugin
  • Build your own project scaffolding with Yeoman
  • Build your own CNPM/NPM installation and generate your own custom project architecture
  • Build your own scaffolding by imitating vue-CLI
  • Teach you to build a front-end scaffolding tool from scratch
  • Node.js based scaffolding tool development experience
  • Build scaffolding from scratch
  • The React component steps from scaffolding to release in NPM