Что может заблокировать рендеринг HTML-страницы?

JS-скрипты без атрибутов async или defer, расположенные в head. CSS-файлы без атрибутов media="print" или media="all", расположенные в head. CSS с @import.

Короткий ответ

Что ответить на собеседовании

JS-скрипты без атрибутов async или defer, расположенные в <head>. CSS-файлы без атрибутов media="print" или media="all", расположенные в <head>. CSS с @import.

Подробный разбор

Ответ с пояснениями

JS-скрипты без атрибутов async или defer, расположенные в <head>. CSS-файлы без атрибутов media="print" или media="all", расположенные в <head>. CSS с @import.

<!DOCTYPE html>
<html>
<head>
    <title>Block Rendering Example</title>
    <!-- Блокирует рендеринг -->
    <script src="blocking-script.js"></script>
    <!-- Блокирует рендеринг -->
    <link rel="stylesheet" href="blocking-style.css">
    <!-- Не блокирует рендеринг -->
    <script src="non-blocking-script.js" async></script>
    <!-- Не блокирует рендеринг -->
    <link rel="stylesheet" href="non-blocking-print-style.css" media="print">
</head>
<body>
    <h1>Content</h1>
</body>
</html>

ИИ-помощник для собеседований

Хочешь уверенно проходить собеседования?

Попробуй ИИ-помощник для собеседований: слышит вас и собеседника, анализирует экран, подсказывает ответы в реальном времени, работает без VPN и не попадает в захват экрана.

Подробнее