Специализация
Python Backend Developer
Java Backend Developer
Node.js Backend Developer
Golang Backend Developer
React Frontend Developer
Выберите навыки
React
JavaScript
Git
Redux
Webpack
Сложность
1-3
4-6
7-8
9-10
Рейтинг вопросов
1
2
3
4
5
Подпишись на React Developer в телеграм
Для чего используется тег <link>?
Тег <link> используется для подключения внешних ресурсов к HTML-документу. Чаще всего он применяется для подключения CSS-стилей. Тег располагается внутри секции <head> и не отображается на странице.
Пример:
<link rel="stylesheet" href="styles.css">
Этот код подключает файл стилей styles.css к странице.
В чем разница между display: none и visibility: hidden?
• display: none полностью удаляет элемент с веб-страницы, как если бы его не существовало. Он не занимает места в макете, и элементы после него сдвигаются, чтобы занять его пространство.
• visibility: hidden скрывает элемент, но оставляет его место на странице. Элемент всё ещё занимает пространство в макете, но не виден пользователю.
Что такое prop drilling?
Prop drilling — это процесс передачи данных от родительского компонента к дочерним через "пропсы", даже если промежуточные компоненты не используют эти данные. Это может усложнить код, особенно при глубокой вложенности компонентов. Проблему prop drilling можно решить, используя такие подходы, как Context API или библиотеки управления состоянием (например, Redux).
Пример:
function App() {
return <Parent data="Привет" />;
}
function Parent({ data }) {
return <Child data={data} />;
}
function Child({ data }) {
return <Grandchild data={data} />;
}
function Grandchild({ data }) {
return <h1>{data}</h1>;
}Что такое доступность (accessibility)?
Доступность (accessibility) — это практика создания веб-сайтов, которые могут использовать все пользователи, включая людей с ограниченными возможностями. Это включает улучшения, такие как использование правильных заголовков, текста для экранных читалок, цветовые контрасты и навигация с клавиатуры. Цель — обеспечить доступ к информации и функциональности всем пользователям, независимо от их возможностей.
Что такое ARIA (Accessible Rich Internet Applications), и как правильно использовать атрибуты ARIA для улучшения доступности?
ARIA (Accessible Rich Internet Applications) — это набор атрибутов, который помогает разработчикам улучшать доступность сложных веб-приложений для людей с ограниченными возможностями. Атрибуты ARIA могут быть добавлены к HTML-элементам, чтобы описать их роли, состояния и свойства для экранных читалок и других вспомогательных технологий. Например, атрибуты ARIA могут помочь определить, что элемент является кнопкой или заголовком, и предоставить информацию о его состоянии (например, "раскрыто" или "закрыто"). Правильное использование ARIA делает контент более понятным и доступным для всех пользователей.
Как работают Content Security Policy (CSP) заголовки и атрибуты вроде integrity в теге <script>?
Что такое Content Delivery Network (CDN) и как правильно подключать ресурсы HTML через CDN для повышения производительности?
Как работает inline-кеширование (inline caching) и почему оно важно для производительности?
Как реализовать Content Security Policy (CSP) для защиты веб-приложений на JavaScript?
В чем разница между inline, block и inline-block элементами в CSS?
Рейтинг:
3
Сложность:
6
Content Security Policy (CSP) — это механизм безопасности, который помогает предотвратить различные типы атак, такие как XSS (Cross-Site Scripting), ограничивая, какие ресурсы могут загружаться на странице. Заголовок CSP определяет, откуда разрешено загружать скрипты, стили и другие ресурсы.
Атрибут integrity в теге <script> используется для проверки целостности загружаемого скрипта, чтобы убедиться, что он не был изменен. Если хэш скрипта не совпадает с указанным значением, браузер отклонит его загрузку.
Рейтинг:
3
Сложность:
5
Content Delivery Network (CDN) — это сеть серверов, расположенных по всему миру, которые хранят копии статических ресурсов веб-сайта, таких как изображения, CSS и JavaScript. Подключение ресурсов через CDN позволяет загружать их с ближайшего сервера, что ускоряет время загрузки страницы и снижает нагрузку на основной сервер. Для подключения через CDN обычно используют URL внешних ресурсов, например:
<script src="https://cdn.example.com/library.js"></script>Рейтинг:
2
Сложность:
7
Inline-кеширование — это техника, используемая JavaScript-движками для ускорения доступа к свойствам объектов. При первом обращении к свойству объектного типа кешируется информация о его местоположении, что позволяет при последующих обращениях избежать повторного поиска. Это значительно ускоряет доступ к свойствам объектов, особенно в циклах или часто вызываемых функциях.
Рейтинг:
3
Сложность:
7
Content Security Policy (CSP) — это механизм безопасности, который позволяет разработчикам контролировать, какие ресурсы могут быть загружены и выполнены на веб-странице. CSP реализуется с помощью HTTP-заголовка Content-Security-Policy, где можно указать разрешенные источники скриптов, стилей и других ресурсов. Это помогает предотвратить загрузку вредоносного контента и снижает риск атак типа XSS.
Чтобы внедрить CSP, достаточно добавить соответствующий заголовок на сервер или в мета-тег на странице.
Рейтинг:
1
Сложность:
2
Элементы block занимают всю ширину родителя и начинаются с новой строки, элементы inline размещаются в одной строке и занимают только необходимую ширину, а inline-block совмещает свойства обоих — размещается в одной строке, но позволяет задавать ширину и высоту. Различие между этими типами влияет на построение и компоновку страницы.
Рейтинг:
1
Сложность:
3
Рейтинг:
2
Сложность:
4
Рейтинг:
3
Сложность:
5
Рейтинг:
2
Сложность:
4
Рейтинг:
2
Сложность:
5