Frontend Interview - собеседования по Javascript / Html / Css
前往频道在 Telegram
Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Купить рекламу: https://telega.in/c/frontendinterview Канал в реестре РКН: https://rknn.link/su
显示更多
网络:📈 Telegram 频道 Frontend Interview - собеседования по Javascript / Html / Css 的分析概览
频道 Frontend Interview - собеседования по Javascript / Html / Css (@frontendinterview) 俄语 语言赛道中的 是活跃参与者。目前社区聚集了 10 745 名订阅者，在 技术与应用 类别中位列第 11 396，并在 俄罗斯 地区排名第 60 301 位。
📊 受众指标与增长动态
自 невідомо 创建以来，项目保持高速增长，吸引了 10 745 名订阅者。
根据 12 七月, 2026 的最新数据，频道保持稳定运转。过去 30 天订阅人数变化为 -96，过去 24 小时变化为 -3，整体触达仍然可观。
- 认证状态： 未认证
- 互动率 (ER)： 平均受众互动率为 6.80%。内容发布后 24 小时内通常能获得 4.13% 的反应，占订阅者总量。
- 帖子覆盖： 每篇帖子平均可获得 731 次浏览，首日通常累积 444 次浏览。
- 互动与反馈： 受众积极参与，单帖平均反应数为 2。
- 主题关注点： 内容集中在 javascript, браузер, html, css, видимость 等核心主题上。
📝 描述与内容策略
作者将该频道定位为表达主观观点的平台：
“Канал для подготовки к собеседованиям по фронтенду
Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront
Купить рекламу: https://telega.in/c/frontendinterview
Канал в реестре РКН:
https://rknn.link/su”
凭借高频更新（最新数据采集于 13 七月, 2026），频道始终保持新鲜度与高覆盖。分析显示受众积极互动，使其成为 技术与应用 类别中的关键影响点。
10 745
订阅者
-324 小时
-247 天
-9630 天
帖子存档
Какое значение примет result?
Что такое прогрессивный рендеринг?
Прогрессивный рендеринг — имя, данное технологиям, используемым для ускорения отрисовки страниц (в частности, уменьшение времени загрузки), чтобы показать пользователю контент как можно скорее.
Примеры технологий:
1. Ленивая загрузка картинок. Картинки на странице не загружаются все разом. JavaScript подгрузит картинки тогда, когда пользователь доскроллит до той части страницы, на которой они расположены.
2. Приоритизация видимого контента. Только минимум CSS, контента, скриптов, необходимых для отрисовки той части страницы, которую пользователь увидит первой. Вы можете использовать отложенные скрипты или слушать события DOMContentLoaded или load, чтобы загрузить остальные ресурсы и контент.
3. Асинхронные фрагменты HTML. Отправка в браузер частей HTML-страницы, созданной на бэкенде. Более подробно про эту технологию можно почитать в этой статье.
Какой цвет текста в элементе input?
В чем разница между тегами script, script async и script defer
script — отрисовка HTML блокируется, скрипт извлекается и выполняется немедленно, отрисовка HTML возобновляется после окончания выполнения скрипта.
script async — скрипт будет извлечен и обработан параллельно с отрисовкой HTML, его выполнение закончится как только это будет возможно (обычно до того, как закончилась отрисовка HTML). Используйте async тогда, когда скрипт не зависит от других скриптов на странице, например для аналитики.
script defer — скрипт будет извлечен параллельно с отрисовкой HTML, его выполнение произойдет после того, как вся страница будет загружена. Если таких скриптов несколько, то каждый из них будет исполнятся в том порядке, в котором они расположены в документе. Если скрипту нужен полностью распарсеный DOM, то атрибут defer обеспечит уверенность в том, что на момент отработки скрипта весь HTML отрисован. Нет особой разницы со скриптами, расположенными перед тегом <body>. Отложенный скрипт не должен содержать document.write.
Примечание: Атрибуты async и defer игнорируются, если у тега script нет атрибута src.
👉 @frontendInterview
Хотите освоить фронтенд-разработку? Начните 7 июня с demo-занятия «Базовое использование системы контроля версий Git»!
Вместе с преподавателем Василием Ванчуком вы разберете, зачем нужна система контроля версий и нужны ли для этого отдельные программы. Узнаете, почему Git и как вы будете работать с ним в рамках онлайн-курса «JavaScript Developer. Basic» от OTUS.
Для участия в практической части потребуется установить Node.js, зарегистрировать Github аккаунт и установить Git, сгенерировать SSH ключ и подключить его к Github-профилю.
Регистрируйтесь на занятие https://otus.pw/llRO/
Какое значение примет result?
Для чего отлично подойдут data-атрибуты?
До того, как JavaScript-фреймворки стали популярны, фронтенд-разработчики использовали data-атрибуты чтобы хранить дополнительные данные прямо в DOM без хаков вроде нестандартных атрибутов или дополнительных свойств в DOM. Атрибуты этого семейства предназначены для хранения частных данных пользователя, для которых не существует более подходящих атрибутов или элементов, на странице или в приложении.
На сегодняшний день использование data-атрибутов не поощряется. Одной из причин является то, что пользователь может модифицировать данные в атрибуте, используя инспектор кода в браузере. Данные лучше хранить в самом JavaScript и обновлять DOM при помощи связывания данных через библиотеку или фреймворк.
👉 @frontendInterview
Что из перечисленного не является псевдо-элементом?
Буквы
Вам дано название города. Напишите функцию, возвращающую строку, которая отобразит буквы и сколько раз эти буквы встречаются в названии.
Примеры:
"Chicago" --> "c:**,h:*,i:*,a:*,g:*,o:*"
"Bangkok" --> "b:*,a:*,n:*,g:*,k:**,o:*"
"Las Vegas" --> "l:*,a:**,s:**,v:*,e:*,g:*"
👉 @frontendInterviewЧто делает DOCTYPE?
DOCTYPE — это сокращение от «document type» (тип документа). Он объявляется в HTML для того, чтобы различать стандартный режим или режим совместимости (quirks mode). Его наличие говорит браузеру работать со страницей в стандартном режиме.
При стандартной работе с html документом просто добавляйте <!DOCTYPE html> в начало страницы.
👉 @frontendInterview
Какое значение примет result?
Хотите научиться создавать с помощью React.js серьезные проекты?
📆4 июня в 20-00 мск ждем вас на demo-занятии «Webpack и babel» в рамках онлайн-курса «React.js Developer» от OTUS.
📌Вместе с преподавателем Никитой Овчинниковым вы рассмотрите современные и мощные фишки JavaScript. Пошагово увидите, как с нуля создать проект на React, используя Webpack.
👉🏻Для регистрации на занятие пройдите вступительный тест: https://otus.pw/ppB1/
На что обратить внимание при разработке мультиязычных сайтов?
1. Используйте атрибут lang в HTML.
2. Перенаправляйте пользователей на версию сайта на их языке. Позволяйте быстро и без проблем изменить страну и язык.
3. Текст на картинках плохо поддается адаптации. Многие до сих пор помещают текст на картинки чтобы получить хорошо выглядящий несистемный шрифт на любом компьютере. Однако чтобы перевести текст картинкой, нужно иметь подготовленную картинку с каждой строкой текста для каждого языка. При большом количестве текста это быстро выйдет из под контроля.
4. Ограничение длины слов и предложений. Некоторый контент может быть длиннее при написании на другом языке. Будьте внимательны к макету и проверяйте поведение блоков при переполнении. Количество символов важно в таких элементах, как заголовки, лейблы и кнопки. Но не так важно в основном тексте или в блоке комментария.
5. Помните о восприятии цветов. В разных языках и культурах цвета имеют разное значение. Дизайн должен учитывать эти особенности.
6. Форматируете даты и валюты. Календарные даты иногда пишутся по-разному. Например, «Май 31, 2012» в Америке или «31 мая 2012» в большинстве стран Европы.
7. Не склеивайте переведенные строки. Не пишите что-то вроде "Сегодняшняя дата " + date. Эта фраза будет выглядеть коряво на языках с другим порядком слов. Вместо этого используйте параметры шаблона.
8. Разные направления чтения. В русском мы читаем слева направо, сверху вниз. В традиционном японском языке текст читается сверху вниз, справа налево.
👉 @frontendInterview
itan-markott-otzyvchivyi-veb-dizain.pdf7.09 MB
Отзывчивый веб-дизайн
Книга, написанная практиком для практиков. Она содержит рекомендации, как избежать наиболее распространенных ошибок и создать сайт, который будет удовлетворять требованиям любого пользователя. Кроме того, в ней даны программные коды, которые позволят применить на практике все предложенные разработки.
👉 @frontendInterview
Простая математика
Вам дана строка, содержащая цифры и математические операторы (plus и minus).
Вам нужно произвести математические операции и вернуть результат.
Примеры:
"1plus2plus3plus4" --> "10"
"1plus2plus3minus4" --> "2"
👉 @frontendInterview