ZooTeam Front-end Weekly | Issue 106

For more past issues, please visit: weekly.zoo.team

  1. Toutiao quality optimization – Graphic details page second practice

As a content class applications, has been watching the news read information is the core of the headlines for the user demand, page open speed is directly related to the user use the headline at the core of the experience, in the headlines, more bearing rich enough to keep multiterminal experience under the style and logic of unity, details the content of the page we are carrying through the WebView, However, the performance of WebView itself is relatively poor compared with Native. Therefore, toutiao technical team has been working on optimizing the loading speed of detail pages.

After continuous optimization, the opening experience of details page in Toutiao online is basically invisible to the naked eye. In the following article, we will gradually break down and introduce our ideas and practices for detail page load optimization.

  1. 24 ES6 code snippets to solve real problems

This article summarizes 24 ES6 code snippets based on real-world usage scenarios that can be used to solve a range of problems you might encounter in a project.

  1. Componentized Design: Atomic design practices

The product manager comes up and says, “To help urgently support A requirement, you can add A part of page A to page B and adjust it slightly.” In the MVP phase of a new product, many features and interfaces can be reused from existing products, but we have to redesign and develop for them. …

  1. Exploration and practice of CI/CD in front-end scene

Thanks to the evolution of fundamental technologies in the industry, the engineering approach of front-end projects is constantly evolving.

  1. [WebPack Performance optimization] Compilation speed from 50 to 7S

As the project grew, the number of components became larger and the project became larger, the webpack compilation took longer and longer. Our current project was compiled in the 40s — 70s at a time, which was a very inefficient operation. There are many methods of optimization, and the previous project has done a lot of optimization. This paper explains optimization from the perspective of cache.

  1. React architecture evolution – from synchronous to asynchronous

Understand the evolution of the React architecture and become a better React developer

  1. All the arcane points of CSS are here

CSS everyone is sure but everyone hold grip the situation is different, especially have to work a few years of predecessors (here refers to the us) a lot of CSS play all don’t know, maybe they are accustomed to use components, but the interview and inevitably ask, so I’m finishing the CSS more obscure point summary wrote this article, In the end, there will also be some interview questions often asked CSS related to the interview, see the complete article interview do not panic 😗.

  1. Buried point full resolution, the visualization buried point you care about most is here

Buried point comb

  1. Let’s talk about the principle of qr code scanning login

Scanning two-dimensional code login is now more common, such as wechat, Alipay and other PC login, and it seems that every APP supports scanning code login, do not do a scan code login is embarrassed. As a technical staff, I do not know whether you are interested in the implementation logic behind this, but I have always been curious about the implementation behind this. Recently just saw a video on the principle of scanning code login, so I sorted out this article, I hope to help you.

  1. How to use AOP+IOC to deconstruct front-end project development

How to use AOP+IOC to deconstruct front-end project development

  1. Execution of trusted three-party code in Node.js is “relatively reliable” and efficient

Look at the practice summary of dachang