React Frontend Developer

Question 1

Что такое microdata, и как она используется для структурирования данных на странице? В чем преимущества перед JSON-LD и RDFa?

Accepted Answer

Microdata — это формат, встроенный в HTML, который помогает структурировать данные на странице, чтобы поисковые системы и другие сервисы могли легко их распознать и интерпретировать. Используя атрибуты вроде itemprop и itemscope, разработчики могут описывать сущности, например, товары или статьи. В отличие от JSON-LD, который хранится отдельно от основного HTML-кода, microdata добавляется непосредственно в разметку страницы, что может быть проще для интеграции, но менее гибко для изменения. RDFa — это другая альтернатива, которая может интегрироваться с любыми HTML-элементами.

Question 2

В чём разница между BFS и DFS при обходе графа? Когда выгоднее каждый?

Accepted Answer

BFS (поиск в ширину) обходит граф по уровням, используя очередь. DFS (поиск в глубину) идёт вглубь по одному пути, используя стек или рекурсию. BFS находит кратчайший путь в невзвешенном графе, а DFS использует меньше памяти и подходит для проверки связности или поиска циклов.

Question 3

Как происходит отладка Telegram Mini App: tunneling, Cloudflare, белый IP?

Accepted Answer

Для отладки Telegram Mini App нужно, чтобы Telegram мог получить доступ к вашему серверу. Обычно используют туннелирование (например, ngrok или Cloudflare Tunnel), чтобы временно опубликовать локальный сервер в интернете. Белый IP-адрес — это статический публичный IP, который можно использовать для постоянного доступа, но он требует настройки DNS и HTTPS. Основная цель — обеспечить доступность вашего приложения по HTTPS, так как Telegram требует защищённое соединение.

Question 4

В каких случаях стоит использовать библиотеки вроде React-PDF вместо встроенного в браузер просмотра PDF?

Accepted Answer

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

Question 5

Какие есть подходы к обнаружению и локализации проблем с рендерингом PDF-документов в браузере?

Accepted Answer

Для обнаружения проблем с рендерингом PDF в браузере используют инструменты разработчика (вкладка Network, Console), проверяют корректность URL и MIME-типа, тестируют в разных браузерах, а также используют встроенные просмотрщики или библиотеки типа PDF.js. Локализация включает проверку версии браузера, расширений и настроек безопасности.

Question 6

Как организовать экспорт данных в Excel и PDF на фронтенде?

Accepted Answer

Для экспорта в Excel используют библиотеки типа SheetJS (xlsx) или ExcelJS, которые создают файлы .xlsx в браузере. Для PDF применяют jsPDF или pdfmake, формируя документ программно или из HTML. Также можно отправлять запрос на сервер, который генерирует файл, но фронтенд-подход быстрее и не нагружает сервер. Выбор зависит от сложности данных и необходимости стилизации.

Question 7

Как сервер понимает, что нужно отдать файл на скачивание, а не просто вернуть сущность (например, при скачивании PDF)?

Accepted Answer

Сервер добавляет HTTP-заголовок Content-Disposition со значением attachment и указывает имя файла. Браузер, увидев attachment, не пытается отобразить содержимое, а сразу предлагает сохранить его. Дополнительно Content-Type сообщает MIME-тип файла, например application/pdf. Без attachment браузер может попытаться открыть PDF прямо во вкладке.

Вопросы React Frontend Developer