2020-08-25 Source of topic: http://www.h-camel.com/index.html
[html] How to optimize the rendering process of the page
First of all, the page rendering process includes the following steps:
1. HTML parsing and building a DOM tree
2. CSS analysis, build CSSOM tree
3. DOM and CSSOM are combined to form a Rendering Tree
4. Layout according to the rendering tree and calculate node information
5. Draw each node on the screen
Note: If the DOM and CSSOM are modified, they will be rearranged and redrawn
optimization:
1. The structure and layout of HTML is complete and clear, and tags are used reasonably
2. CSS optimization, CSS will block loading, put the external style in the head tag, link to introduce
3. JS optimization, js will prevent DOM construction and delay web page rendering. The part that realizes the page effect should be introduced before the body, and the parts that require access to DOM elements such as actions, interactions, and event-driven should be placed after the body. Dynamic loading of js.
4. Reasonable use of cache can also speed up page rendering
[css] Have you encountered any front-end styles that you can't make with css in your work? What if I can't do it?
1. Waterfall flow layout
2. The width and height of the scroll bar
3. Limit on the number of characters per line in any font
4. Precise text layout
Reposted from https://www.zhihu.com/question/31863128/answer/54000633
[js] Enter an expression of four mixed operations, please write a method to find its value
The four arithmetic operations of two values are relatively easy to implement. For mixed operations of multiple values, you can see how js implements the logic of the calculator.
[Soft Skills] What is the difference between synchronous and asynchronous? What are their application scenarios?
The emphasis is on the mechanism of message communication, compare https://www.cnblogs.com/IT-CPC/p/10898871.html