ਮਹੱਤਵਪੂਰਨ ਰੈਂਡਰਿੰਗ ਪਾਥ ਉਹ ਪੜਾਵਾਂ ਦਾ ਇੱਕ ਕ੍ਰਮ ਹੈ ਜੋ ਬ੍ਰਾਉਜ਼ਰ HTML, CSS, ਅਤੇ JS ਨੂੰ ਪਿਕਸਲ ਵਿੱਚ ਬਦਲਣ ਲਈ ਕਰਦਾ ਹੈ। ਇਸ ਨੂੰ ਸਮਝਣਾ ਇਹ ਸਮਝਾਉਂਦਾ ਹੈ ਕਿ ਕੀ ਰੈਂਡਰਿੰਗ ਨੂੰ ਬਲਾਕ ਕਰਦਾ ਹੈ ਅਤੇ ਪੰਨੇ ਨੂੰ ਤੇਜ਼ੀ ਨਾਲ ਪੇਂਟ ਕਰਨਾ ਕਿਵੇਂ ਹੈ।
ਪੜਾਅ
text
1. Parse HTML → DOM tree (the document structure)
2. Parse CSS → CSSOM tree (the style rules)
3. DOM + CSSOM → Render tree (visible nodes + their styles)
4. Layout (reflow) → compute each node's geometry (position/size)
5. Paint → fill in pixels (colors, text, images)
6. Composite → combine layers onto the screen
ਕੀ ਰੈਂਡਰਿੰਗ ਨੂੰ ਬਲਾਕ ਕਰਦਾ ਹੈ
ਬ੍ਰਾਉਜ਼ਰ ਉਦੋਂ ਤੱਕ ਪੇਂਟ ਨਹੀਂ ਕਰਦਾ ਜਦੋਂ ਤੱਕ CSSOM ਤਿਆਰ ਨਹੀਂ ਹੋਵੇ (ਬਿਨਾ ਸਟਾਈਲ ਕੀਤੇ ਮਸਾਲੇ ਨੂੰ ਰੋਕਣ ਲਈ)। ਇਸ ਲਈ ਵੱਡੀ/ਹੌਲੀ CSS ਪਹਿਲੀ ਪੇਂਟ ਨੂੰ ਦੇਰੀ ਕਰਦੀ ਹੈ — ਮਹੱਤਵਪੂਰਨ CSS ਨੂੰ ਛੋਟਾ ਰੱਖੋ ਅਤੇ ਜਦੋਂ ਸੰਭਵ ਹੋ ਇਸਨੂੰ ਇਨਲਾਈਨ ਕਰੋ।