Frontend | Вопросы собесов

🤔 Какие виды инпутов бывают? HTML предоставляет множество типов <input> элементов, которые можно использовать для различных целей в веб-формах. Каждый тип <input> элемента определяет, какие данные могут быть введены пользователем и как эти данные будут отображаться в браузере. 🚩Основные типы: 🟠Текстовые инпуты: Однострочное текстовое поле для ввода обычного текста.

<input type="text" name="username">  

Однострочное текстовое поле для ввода пароля, где введенные символы скрыты.

<input type="password" name="password">   

Поле для ввода адреса электронной почты. Проверяет правильность формата введенного значения.

<input type="email" name="email">   

Поле для ввода поискового запроса.

<input type="search" name="search">  

Поле для ввода телефонного номера.

<input type="tel" name="phone">   

Поле для ввода URL-адреса. Проверяет правильность формата введенного значения.

<input type="url" name="website">   

🟠Числовые инпуты: Поле для ввода чисел. Может включать стрелки для увеличения или уменьшения значения.

<input type="number" name="quantity" min="1" max="10">   

Ползунок для выбора значения из заданного диапазона.

<input type="range" name="volume" min="0" max="100"> 

🟠Дата и время: Поле для выбора даты.

<input type="date" name="birthday">   

Поле для выбора даты и времени (без часового пояса).

<input type="datetime-local" name="meeting-time">   

Поле для выбора месяца и года.

<input type="month" name="expiry">   

Поле для выбора недели и года.

<input type="week" name="week">   

Поле для выбора времени.

<input type="time" name="alarm">   

🟠Выбор файлов и цвета: Поле для загрузки файлов с компьютера.

<input type="file" name="resume">

Поле для выбора цвета с помощью цветовой палитры.

<input type="color" name="favcolor">   

🟠Интерактивные элементы: Флажок для выбора/отмены выбора опции.

<input type="checkbox" name="subscribe" value="newsletter">  

Радиокнопка для выбора одного значения из группы.

<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female   

Кнопка для выполнения действия.

<input type="button" value="Click me">   

Кнопка для отправки формы на сервер.

<input type="submit" value="Submit">   

Кнопка для сброса формы до исходных значений.

<input type="reset" value="Reset">

Ставь 👍 и забирай 📚 Базу знаний

🤔 Чем var отличается от const? Переменные, объявленные через var, могут быть переназначены, тогда как const блокирует возможность переназначения после инициализации. Также, const требует обязательной инициализации при объявлении. Var имеет функциональную область видимости, в то время как const ограничен блочной областью видимости. Const используется для переменных, значения которых не должны изменяться. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

Обучаем Java-разработчиков оплата после выхода на работу В Kata Academy можно выучиться на Java-разработчика бесплатно, а заплатить уже после трудоустройства по специальности из фактической зарплаты. Если задуматься, то все в выигрыше: — ты получаешь работу в Москве или Санкт-Петербурге с хорошей зарплатой, мы получаем процент за инвестиции в тебя; — в наших интересах научить тебя так, чтобы твоя зарплата была как можно выше; — мы прокачиваем твои навыки еще 2 года после курса: проводим выездные мероприятия и мастер-классы — и доходы наших выпускников растут; — мы не зависим от банков и их рассрочек — кризис не повлиял на доступность курсов. Чтобы попасть на курс, нужно выполнить небольшое тестовое задание. Переходи по ссылке и оставляй заявку! Узнать больше #реклама 16+ kata.academy О рекламодателе

🤔 Как изменить направление оси flexbox контейнера? Чтобы изменить направление оси flexbox-контейнера, нужно использовать свойство CSS flex-direction. Это свойство определяет основную ось контейнера и направление размещения flex-элементов. 🚩Возможных значения flex-direction 🟠row: Основная ось — горизонтальная, элементы располагаются слева направо. Это значение по умолчанию. 🟠row-reverse: Основная ось — горизонтальная, элементы располагаются справа налево. 🟠column: Основная ось — вертикальная, элементы располагаются сверху вниз. 🟠column-reverse: Основная ось — вертикальная, элементы располагаются снизу вверх. 🚩Примеры использования: Горизонтальное направление (слева направо):

.container {
    display: flex;
    flex-direction: row; /* или просто не указывать, так как это значение по умолчанию */
}

Горизонтальное направление (справа налево):

.container {
    display: flex;
    flex-direction: row-reverse;
}

Вертикальное направление (сверху вниз):

.container {
    display: flex;
    flex-direction: column;
}

Вертикальное направление (снизу вверх):

.container {
    display: flex;
    flex-direction: column-reverse;
}

Пример HTML и CSS:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Flexbox Direction</title>
    <style>
        .container {
            display: flex;
            flex-direction: row; /* Измените значение на row-reverse, column, или column-reverse для проверки разных направлений */
            border: 1px solid #000;
            height: 200px;
        }
        .item {
            flex: 1;
            border: 1px solid #ccc;
            padding: 10px;
            margin: 5px;
            text-align: center;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="item">Item 1</div>
        <div class="item">Item 2</div>
        <div class="item">Item 3</div>
    </div>
</body>
</html>

Ставь 👍 и забирай 📚 Базу знаний

Привет! Хочешь узнать, как инди-разработчик создал свою игровую студию с нуля и привлёк в неё $1,5 миллиона инвестиций? 🚀 «Будни Фаундера» — это канал, где Никита Покручин, предприниматель и основатель LEVEL 26 GAMES, делится своим реальным опытом создания успешного стартапа в игровой индустрии. Что ты найдёшь в канале: - 🔥 Реальные кейсы и инсайты из жизни фаундера, который прошёл путь от инди-разработчика до владельца студии стоимостью $5 млн. - 🎯 Практические советы по привлечению инвестиций: как подготовиться, где искать инвесторов и как успешно провести переговоры. - ⚠️ Разбор ошибок и уроков, которые помогут тебе избежать типичных проблем при создании стартапа. 📌 В закрепе канала тебя ждёт статья 10 ключевых уроков из моего пути к привлечению $1,5 млн инвестиций. Почему стоит подписаться на «Будни Фаундера»: ➡️ Никита создал студию с нуля, а сейчас она оценивается в $5 миллионов, включает команду из 15 талантливых специалистов, а в их игру ежедневно играют десятки тысяч игроков ➡️ Три раза привлекал в свои проекты инвестиции на общую сумму $1,5 млн и готов поделиться практическими советами. ➡️ В канале ты узнаешь, как реально запускаются стартапы, как привлекается финансирование и как избежать типичных ошибок фаундеров. Если ты: ✅ Думаешь о том, чтобы запустить свой стартап ✅ Хочешь узнать, как выглядит управление стартапом и его развитием изнутри ✅ Стремишься научиться привлекать инвестиции и выстраивать отношения с инвесторами ...то этот канал для тебя! 👉 Подписывайся на «Будни Фаундера» сейчас и забирай оттуда статью "10 ключевых уроков из моего пути к привлечению $1,5 млн инвестиций". Так сказать инсайты из первых рук! [ПОДПИСАТЬСЯ НА КАНАЛ]

🤔 Чем let отличается от var? Переменные, объявленные через let, имеют блочную область видимости, тогда как var — функциональную область видимости. Это значит, что let не доступен за пределами блока, в котором объявлен, а var доступен в пределах функции. Также, переменные, объявленные через let, не подвержены всплытию (hoisting) так же, как var. Let считается более безопасным для использования в современных проектах. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

🤔 Зачем придумали async/await? Ключевой целью введения async/await в JavaScript было упростить написание и чтение асинхронного кода, сделать его более линейным и похожим на синхронный. 🟠Улучшение читаемости кода Асинхронный код, написанный с использованием коллбеков или промисов, может быть трудным для чтения и понимания, особенно когда имеется несколько вложенных асинхронных операций. async/await делает асинхронный код более линейным, что упрощает его понимание. Пример с промисами:

function fetchData() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve("some data");
    }, 1000);
  });
}

fetchData().then((data) => {
  console.log(data);
}).catch((error) => {
  console.error(error);
});

Пример с async/await:

async function fetchData() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve("some data");
    }, 1000);
  });
}

async function main() {
  try {
    const data = await fetchData();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

main();

🟠Избегание "ада коллбеков" Когда асинхронные операции вложены друг в друга, код становится трудным для чтения и сопровождения. Это называется "адом коллбеков" (callback hell). async/await позволяет писать асинхронный код последовательно, без вложенности. Пример с промисами:

getData((data) => {
  processData(data, (processedData) => {
    saveData(processedData, (result) => {
      console.log(result);
    });
  });
});

Пример с async/await:

async function main() {
  try {
    const data = await getData();
    const processedData = await processData(data);
    const result = await saveData(processedData);
    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

main();

🟠Снижение вероятности ошибок Когда используется async/await, ошибки могут быть обработаны с использованием привычного try/catch блока, что снижает вероятность пропуска ошибок. Пример с промисами:

fetchData().then((data) => {
  return processData(data);
}).then((processedData) => {
  return saveData(processedData);
}).catch((error) => {
  console.error(error);
});

Пример с async/await:

async function main() {
  try {
    const data = await fetchData();
    const processedData = await processData(data);
    const result = await saveData(processedData);
    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

main();

Ставь 👍 и забирай 📚 Базу знаний

IT Community Day в Санкт-Петербурге прошёл идеально! 👨‍💻 Сотни IТ-специалистов встретились, чтобы послушать доклады топовых спикеров, прокачать hard и soft skills, познакомиться, повеселиться на афтерпати, и главное — стать частью крупнейшего IТ-комьюнити! Завидуем тем, кто смог попасть на это мероприятие. А остальным советуем не расстраиваться: совсем скоро состоятся IT Community Day в: ✔️ В Казани 12 октября научимся управлять большими данными, укрощать искусственный интеллект, создавать успешное резюме и находить подход к карьере. ✔️ И в Екатеринбурге 19 октября поговорим об интеграции LLM в приложение, методологии API-first и комбинации личного и профессионального развития. Успейте зарегистрироваться! 💚 👉 Казань, 12 октября 👉 Екатеринбург, 19 октября

🤔 Что такое virtual dom? Virtual DOM — это легковесное представление реального DOM, которое используется для оптимизации обновлений пользовательского интерфейса. При изменении состояния приложения, виртуальный DOM обновляется сначала, после чего вычисляются минимальные изменения для реального DOM. Это позволяет сократить количество операций с реальным DOM, которые могут быть затратными. Virtual DOM широко используется в библиотеках, таких как React. Ставь 👍 и забирай 📚 Базу знаний

Проект ДКЭ предлагает работу мечты по результатам теста! Ищешь стажировку или работу в крупной компании? Мы ждали тебя, чтобы предоставить уникальную возможность получить работу мечты! Список компаний внушительный — среди них МТС, Сбер, Лукойл, Ингосстрах, Росатом и другие. Участие в нашем проекте бесплатное и доступно для жителей России старше 18 лет! Переходи по ссылке, пройди тестирование по профессии и получи предложение от работодателей. Попробовать #реклама dke.moscow О рекламодателе

🤔 Для чего нужен cors? CORS (Cross-Origin Resource Sharing) нужен для того, чтобы браузеры могли безопасно выполнять запросы к ресурсам на других доменах. Это важный механизм безопасности, который помогает предотвратить несанкционированный доступ к данным. 🚩Почему это нужно? Интернет состоит из множества доменов, и иногда приложения на одном домене хотят получать данные с другого домена. Однако браузеры по умолчанию блокируют такие запросы из соображений безопасности, чтобы предотвратить атаки типа CSRF (Cross-Site Request Forgery) и XSS (Cross-Site Scripting). 🚩Как это работает? Когда браузер пытается сделать запрос к ресурсу на другом домене, он сначала отправляет предварительный запрос (preflight request), чтобы узнать, разрешает ли сервер такой запрос. Этот предварительный запрос использует метод OPTIONS. Если сервер разрешает доступ, он отвечает с заголовками, которые сообщают браузеру, что запрос может быть выполнен. Основные заголовки, используемые в CORS, включают: 🟠Access-Control-Allow-Origin: указывает, каким доменам разрешен доступ к ресурсу. 🟠Access-Control-Allow-Methods: указывает, какие методы HTTP разрешены при доступе к ресурсу. 🟠Access-Control-Allow-Headers: указывает, какие заголовки могут быть использованы при выполнении запроса. 🚩Пример 🟠Если ваше фронтенд-приложение находится на домене frontend.com, а API, к которому оно хочет получить доступ, находится на api.backend.com. Когда фронтенд отправляет запрос к API, браузер отправляет предварительный запрос:

OPTIONS /data HTTP/1.1
Host: api.backend.com
Origin: http://frontend.com
Access-Control-Request-Method: GET
Access-Control-Request-Headers: Content-Type

🟠Если сервер api.backend.com разрешает доступ, он отвечает следующим образом: После этого браузер отправляет основной запрос, и API отвечает с данными.

HTTP/1.1 200 OK
Access-Control-Allow-Origin: http://frontend.com
Access-Control-Allow-Methods: GET, POST
Access-Control-Allow-Headers: Content-Type

Ставь 👍 и забирай 📚 Базу знаний

GitHub – умер. 90% контента генерится через ChatGPT, а реально полезные материалы собирают мало просмотров и не выводядся в топ. Хорошо, что есть канал Технологичка. Там тима айтишников и дизайнеров ручками отсматривают статьи с GitHub, Reddit и Toster, выкладывая самую годноту. Все материалы отсортированы по темам и категориям. Подойдет всем: от фронтендов до девопс-инженеров. В общем, пользуйтесь, таких каналов реально единицы: https://t.me/+YIlY3QQmUfszNTA0

🤔 Какие типы данных существуют в javascript? В JavaScript существует 7 примитивных типов данных: string, number, boolean, null, undefined, symbol и bigint. Помимо примитивных типов, есть объектный тип — object, который включает массивы, функции и другие сложные структуры. Примитивы передаются по значению, а объекты — по ссылке. Также BigInt добавлен для работы с большими целыми числами. Ставь 👍 и забирай 📚 Базу знаний

🤔 Зачем отправляется http запрос ? HTTP-запросы (HTTP requests) отправляются для обмена данными между клиентом и сервером в сети Интернет. Они являются основным механизмом взаимодействия в веб-приложениях, обеспечивая передачу информации между веб-браузерами, веб-серверами и другими компонентами сети. 🚩Причины отправки 🟠Запрос веб-страниц Когда пользователь вводит URL в адресную строку браузера или переходит по ссылке, браузер отправляет HTTP-запрос к серверу для получения содержимого веб-страницы.

GET / HTTP/1.1
Host: www.example.com 

🟠Загрузка ресурсов Веб-страницы обычно содержат ссылки на дополнительные ресурсы, такие как изображения, стили (CSS), скрипты (JavaScript), шрифты и другие файлы. Для каждого из этих ресурсов браузер отправляет отдельный HTTP-запрос.

GET /styles/main.css HTTP/1.1
Host: www.example.com  

🟠Отправка данных на сервер Веб-приложения часто требуют отправки данных от клиента к серверу. Это может быть регистрация пользователя, отправка формы, выполнение поиска и т.д. Такие запросы обычно используют метод POST.

POST /register HTTP/1.1
Host: www.example.com
Content-Type: application/x-www-form-urlencoded
Content-Length: 45

username=johndoe&password=securepassword 

🟠Получение данных с сервера Веб-приложения также часто запрашивают данные с сервера для обновления содержимого страницы без её перезагрузки. Это особенно актуально для одностраничных приложений (SPA), использующих AJAX-запросы.

GET /api/user/123 HTTP/1.1
Host: www.example.com

🟠Выполнение CRUD-операций CRUD (Create, Read, Update, Delete) операции являются основными операциями управления данными в веб-приложениях. HTTP-запросы различных методов (POST, GET, PUT, DELETE) используются для выполнения этих операций.

PUT /api/user/123 HTTP/1.1
Host: www.example.com
Content-Type: application/json
 Content-Length: 60

{"username":"johndoe","email":"johndoe@example.com"}

Ставь 👍 и забирай 📚 Базу знаний

⚡Узнайте об актуальных инструментах веб-разработки в 2024 году, последних тенденциях и лучших практиках в разработке фронтенда (React, Vue 3, Svelte) и бэкенда (C#, ASP.NET)! 🔥17 октября в 20.00 мск приглашаем на открытую конференцию "Эффективная веб-разработка в 2024 году: новинки в React, Vue и ASP.NET",  на которой обсудим: ✅ React, Vue 3 и Svelte: ключевые обновления в этих фреймворках, которые упрощают создание и поддержку кода. Преимущества и недостатки каждого фреймворка; ✅ Новые возможности .NET 8/9: улучшения в C# и ASP.NET; ✅ Интеграция с фронтендом: продемонстрируем, как легко создавать и взаимодействовать с современными фронтенд-технологиями. 👉Регистрация https://otus.pw/x19wx/?erid=LjN8K1h5d 🎁Бонусы участника: Карта развития навыков специалиста ASP.NET  и  Базовые операторы в JavaScript #реклама О рекламодателе

🤔 Что такое promise и какие состояния у него есть? Promise в JavaScript — это объект, который представляет результат асинхронной операции. Он может находиться в одном из трёх состояний: pending (ожидание), fulfilled (выполнено) и rejected (отклонено). Fulfilled означает, что операция завершилась успешно, а rejected — что произошла ошибка. Это удобный способ работы с асинхронным кодом и упрощает обработку результатов таких операций. Ставь 👍 и забирай 📚 Базу знаний

🤔 Где заканчивается js, а где начинается дом ? JS заканчивается там, где он перестает быть просто набором инструкций и начинает манипулировать DOM, т.е. когда скрипт обращается к элементам страницы (например, через document.getElementById), он начинает взаимодействовать с DOM для изменения структуры, стилей или содержимого веб-страницы. 🚩JavaScript Используется для создания динамических и интерактивных веб-страниц. Он работает в браузере и на сервере (с помощью Node.js). JavaScript сам по себе не имеет знаний о веб-странице или ее структуре. Он предоставляет синтаксис и базовые возможности для выполнения вычислений, обработки данных, работы с объектами и функциями. 🚩Основные возможности: 🟠Управление переменными и типами данных: Объявление переменных (var, let, const). Работа с различными типами данных (строки, числа, объекты, массивы). 🟠Управление потоком: Условные операторы (if, else, switch). Циклы (for, while, do-while). 🟠Работа с функциями: Объявление и вызов функций. Работа с анонимными и стрелочными функциями. 🟠Объектно-ориентированное программирование: Создание объектов и классов. Наследование и полиморфизм. 🚩DOM (Document Object Model) Это программный интерфейс для веб-документов. Он представляет структуру HTML-документа как дерево объектов, которые могут быть изменены скриптами (например, JavaScript). DOM позволяет JavaScript взаимодействовать с HTML-страницей: изменять элементы, стили, атрибуты и содержимое страницы. 🚩Основные возможности: 🟠Доступ к элементам: Получение элементов по идентификатору(document.getElementById), классу(document.getElementsByClassName), тегу(document.getElementsByTagName), селектору(document.querySelector, document.querySelectorAll). 🟠Изменение структуры документа: Создание новых элементов (document.createElement). Добавление и удаление элементов (appendChild, removeChild). 🟠Изменение содержимого и атрибутов: Изменение текста и HTML-содержимого (element.textContent, element.innerHTML). Управление атрибутами (element.setAttribute, element.getAttribute). 🟠События: Добавление обработчиков событий (element.addEventListener). Создание и отправка пользовательских событий. 🚩Примеры Изменение содержимого элемента:

<!DOCTYPE html>
<html>
<head>
    <title>Пример DOM</title>
</head>
<body>
    <div id="myDiv">Исходный текст</div>
    <button onclick="changeText()">Изменить текст</button>

    <script>
        function changeText() {
            // Получение элемента DOM
            const myDiv = document.getElementById('myDiv');
            // Изменение содержимого элемента
            myDiv.textContent = 'Измененный текст';
        }
    </script>
</body>
</html>

Создание и добавление нового элемента:

<!DOCTYPE html>
<html>
<head>
    <title>Пример добавления элемента</title>
</head>
<body>
    <button onclick="addElement()">Добавить элемент</button>

    <script>
        function addElement() {
            // Создание нового элемента
            const newElement = document.createElement('p');
            newElement.textContent = 'Новый параграф';

            // Добавление нового элемента в DOM
            document.body.appendChild(newElement);
        }
    </script>
</body>
</html>

🚩Граница JavaScript — это язык программирования, который предоставляет базовые возможности для работы с данными и логикой. DOM — это интерфейс, который предоставляет структуру HTML-документа и позволяет JavaScript взаимодействовать с этой структурой. Граница между ними можно представить так: 🟠JavaScript: Работа с данными, логика выполнения, функции, объекты и т.д. 🟠DOM: Представление HTML-документа как дерева объектов и возможность манипуляции этими объектами через JavaScript. Ставь 👍 и забирай 📚 Базу знаний

Верстаешь? Оцени 7 причин пройти наш бесплатный интенсив по Frontend-разработке: 1. Ты сверстаешь веб-сайт на HTML + CSS; 2. Оживишь страницу с помощью JavaScript; 3. Используешь фронтенд-фреймворк Angular; 4. Подключишь Backend и загрузишь сайт на хостинг; 5. Получишь советы по доработке своего проекта; 6. Добавишь в портфолио 1 качественный проект; 7. Получишь в подарок чек-лист «45 мест для поиска работы». А главное, ты проведёшь 7 дней в приятной компании Fullstack-разработчика с 10-летним стажем – Романа Чернова. 👉 Проскочить на интенсив бесплатно Начинаем уже завтра. 🔥 С нас обучение, практика и помощь с выходом на фриланс.

🤔 Почему http-2, а не http-1 ? HTTP/2 предпочтительнее HTTP/1.1 потому, что он позволяет мультиплексирование запросов по одному соединению, сжимает заголовки для эффективности передачи данных и улучшает общую производительность веб-сайтов за счет бинарного формата и приоритезации потоков. 🚩Минусы ➖Ограниченное количество одновременных соединений: HTTP/1.1 позволяет использовать несколько одновременных соединений для загрузки ресурсов с одного домена, но это число ограничено (обычно 6-8 соединений). Это приводит к значительным задержкам, особенно при загрузке большого количества ресурсов (изображений, скриптов, стилей) на современных веб-страницах. ➖Небольшие размеры заголовков: В HTTP/1.x заголовки передаются в каждом запросе и ответе, что увеличивает накладные расходы, особенно при использовании длинных куки-файлов и других данных заголовков. ➖Отсутствие мультиплексирования: HTTP/1.x не поддерживает отправку нескольких запросов и ответов одновременно по одному соединению, что приводит к блокировке при медленных запросах или больших ресурсах. ➖Частые разрывы соединений: В HTTP/1.x соединения часто закрываются после завершения передачи данных, что требует повторного установления соединений для последующих запросов, увеличивая задержки. 🚩Плюсы ➕Бинарный протокол: HTTP/2 использует бинарное кодирование вместо текстового в HTTP/1.x, что упрощает анализ и обработку данных, а также снижает вероятность ошибок. ➕Мультиплексирование: HTTP/2 позволяет отправлять несколько запросов и получать несколько ответов одновременно по одному TCP-соединению, устраняя блокировку и повышая эффективность передачи данных. ➕Сжатие заголовков (HPACK): HTTP/2 использует эффективное сжатие заголовков, что значительно уменьшает накладные расходы при передаче заголовков. ➕Приоритеты потоков: HTTP/2 поддерживает установку приоритетов для отдельных потоков данных, что позволяет более эффективно управлять передачей важных ресурсов. ➕Постоянные соединения: HTTP/2 поддерживает длительные соединения, что уменьшает количество повторных установлений соединений и улучшает производительность. ➕Серверная инициатива (Server Push): HTTP/2 позволяет серверу отправлять ресурсы клиенту до того, как они будут запрошены, что ускоряет загрузку страниц. 🚩Примеры преимуществ HTTP/2 🟠Мультиплексирование: В HTTP/1.1 каждый запрос требует отдельного соединения или использования техники keep-alive для удержания соединения открытым, что приводит к блокировке. В HTTP/2, благодаря мультиплексированию, все ресурсы могут быть загружены одновременно по одному соединению. 🟠Сжатие заголовков: Заголовки в HTTP/2 сжимаются, что особенно полезно для повторяющихся заголовков, таких как куки. 🟠Server Push: Сервер может отправлять необходимые ресурсы, такие как стили и скрипты, до того, как клиент их запросит, что снижает количество запросов и улучшает время загрузки страницы. Ставь 👍 и забирай 📚 Базу знаний