\n\n\n

Сайт загружается...

\n\n\n🟠Решение: подключение в конце `` \nЕсли разместить \n\n\n🟠Альтернативы: `defer` и `async` \ndefer – отложенное выполнение после загрузки HTML\n\n \n\n\nasync – загрузка и выполнение параллельно \n\n \n\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-12-08T09:05:40Z","dateModified":"2025-12-08T09:05:40Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2183},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":8},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":17}]}},{"@type":"ListItem","position":12,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2195","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2195","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2195","headline":"Тютю-гребень или капикрыса? Побалуйте себя роскошью от Ричарда Сапогова или утепляйтесь с культовой рубашкой…","articleBody":"Тютю-гребень или капикрыса?\n\nПобалуйте себя роскошью от Ричарда Сапогова или утепляйтесь с культовой рубашкой Инженера. Выбирайте фаворитов из коллекции с персонажами Антона Лапенко. \n\nПерейти на сайт\n\n#реклама \ntbank.ru\nО рекламодателе","datePublished":"2025-12-07T23:50:00Z","dateModified":"2025-12-09T21:50:06Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1517},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":2}]}},{"@type":"ListItem","position":13,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2194","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2194","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2194","headline":"🤔 Что известно про graceful shutdown и где применяется? Graceful shutdown — это корректное завершение работы…","articleBody":"🤔 Что известно про graceful shutdown и где применяется?\n\nGraceful shutdown — это корректное завершение работы приложения:\n- Завершение активных соединений;\n- Очистка ресурсов (например, соединений с БД);\n- Применяется в серверных приложениях, микросервисах, особенно при развертывании и обновлении.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2025-12-07T16:10:38Z","dateModified":"2025-12-07T16:10:38Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2106},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":5},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":4}]}},{"@type":"ListItem","position":14,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2193","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2193","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2193","headline":"🤔 Какие используешь подходы для написания приложения которую проще поддерживать, чем делать первоначальную ра…","articleBody":"🤔 Какие используешь подходы для написания приложения которую проще поддерживать, чем делать первоначальную разработку?\n\nПри разработке frontend-приложений, которые в будущем будет проще поддерживать и масштабировать, я придерживаюсь ряда ключевых подходов. \n\n🟠Разделение ответственности (Separation of Concerns)\nЭто значит, что код должен быть разделен по зонам ответственности. В frontend-разработке это проявляется в: \nЧистом разделении логики, представления и данных (например, с помощью архитектуры MVC, MVVM или FLUX). \nИспользовании компонентов в React/Vue или шаблонов в Angular. \nРазделении CSS, JS и HTML, либо использовании методологий, где стили хранятся рядом с компонентом (CSS Modules, Styled Components). \nВместо того, чтобы писать всю логику и разметку в одном файле: \nfunction App() {\n const [count, setCount] = useState(0);\n return setCount(count + 1)}>Count: {count};\n}\n \n\nЯ разделяю бизнес-логику и представление\n// CounterLogic.js\nexport function useCounter() {\n const [count, setCount] = useState(0);\n const increment = () => setCount(count + 1);\n return { count, increment };\n}\n\n// Counter.js\nimport { useCounter } from \"./CounterLogic\";\nfunction Counter() {\n const { count, increment } = useCounter();\n return Count: {count};\n}\n \n\n🟠Компонентный подход и повторное использование кода\nFrontend-приложения должны строиться из переиспользуемых и изолированных компонентов. Это уменьшает дублирование кода и делает его понятным. \n// Button.js (переиспользуемый компонент)\nfunction Button({ onClick, children }) {\n return {children};\n}\n\n// Counter.js (использует Button)\nfunction Counter() {\n const [count, setCount] = useState(0);\n return setCount(count + 1)}>Count: {count};\n}\n \n\n🟠Чистый код и читаемость\nКод должен быть понятным не только мне, но и другим разработчикам. \nПонятные имена переменных и функций. Вместо x → userAge, вместо doSmth() → calculateTotalPrice(). \nМеньше вложенности. Вместо кучи if и else, лучше использовать early return. \nРазбиение кода на модули. Один файл = одна зона ответственности. \nfunction getDiscountedPrice(price, discount) {\n if (discount <= 0) return price;\n return price - price * (discount / 100);\n}\n \n\n🟠Состояние приложения: локальное vs глобальное\nВ зависимости от сложности приложения нужно правильно управлять состоянием: \nЛокальное состояние – useState (React), ref (Vue) для простых данных внутри компонента. \nГлобальное состояние – Redux, MobX, Zustand, Pinia, Context API – когда данные нужны многим компонентам. \nСерверное состояние – React Query, SWR – когда данные приходят с API и их нужно кешировать. \n\n🟠Следование принципам SOLID и DRY\nDRY (Don't Repeat Yourself) – не повторяем код, используем функции, хуки, компоненты. \nSOLID – например, принцип единственной ответственности (Single Responsibility Principle) гласит, что каждый компонент или функция должны решать только одну задачу. \nfunction sendEmailAndSaveToDB(user) {\n sendEmail(user.email);\n saveUserToDatabase(user);\n}\n\nЛучше разделить логику\nfunction sendEmail(email) { /* отправка письма */ }\nfunction saveUserToDatabase(user) { /* сохранение в БД */ }\nfunction registerUser(user) {\n sendEmail(user.email);\n saveUserToDatabase(user);\n}\n\n🟠Использование TypeScript\nTypeScript помогает избежать ошибок и делать код предсказуемым. \ntype User = {\n id: number;\n name: string;\n};\n\nfunction getUserName(user: User): string {\n return user.name;\n}\n \n\n🟠Документация и кодстайл\nESLint + Prettier → автоформатирование и проверка стиля. \nJSDoc/TypeScript → документация функций и типов данных. \nStorybook → для документирования UI-компонентов.\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-12-07T09:05:40Z","dateModified":"2025-12-07T09:05:40Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2085},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":3},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":21}]}},{"@type":"ListItem","position":15,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2192","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2192","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2192","headline":"🤔 Как использовать селектор? Селектор в CSS используется для выбора элементов по тегу, классу, ID или атрибут…","articleBody":"🤔 Как использовать селектор?\n\nСелектор в CSS используется для выбора элементов по тегу, классу, ID или атрибуту. \nВ JS селекторы используются через document.querySelector() или useRef в React.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2025-12-06T16:10:39Z","dateModified":"2025-12-06T16:10:39Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2036},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":7},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":4}]}},{"@type":"ListItem","position":16,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2191","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2191","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2191","headline":"🤔 В чем различие методов call apply bind? Методы call, apply и bind принадлежат к функциональному объекту Fun…","articleBody":"🤔 В чем различие методов call apply bind? \n\nМетоды call, apply и bind принадлежат к функциональному объекту Function и используются для указания контекста this при вызове функции. Хотя все три метода позволяют контролировать значение this внутри функции, между ними существуют ключевые различия в способе использования и поведении.\n\n🚩Сall\n\nВызывает функцию, явно устанавливая this в первом аргументе. Остальные аргументы передаются в вызываемую функцию как есть.\nfunction greet(message, name) {\n console.log(${message}, ${name}. This is ${this});\n}\n\ngreet.call(\"Earth\", \"Hello\", \"Alice\"); // \"Hello, Alice. This is Earth\"\n\n🚩Apply\n\nОчень похож на call, но принимает аргументы в виде массива, а не по отдельности.\nfunction greet(message, name) {\n console.log(\n${message}, ${name}. This is ${this}\n);\n}\n\ngreet.apply(\"Earth\", [\"Hello\", \"Alice\"]); // \"Hello, Alice. This is Earth\"\n\n🚩Bind\n\nСоздаёт новую функцию, которая, когда она вызывается, имеет установленный контекст this, указанный в первом аргументе. В отличие от call и apply, bind не вызывает функцию сразу, а возвращает новую функцию, которую можно вызвать позже.\nfunction greet(message, name) {\n console.log(\n${message}, ${name}. This is ${this}\n);\n}\n\nconst greetEarth = greet.bind(\"Earth\", \"Hello\", \"Alice\");\ngreetEarth(); // \"Hello, Alice. This is Earth\"\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-12-06T09:05:40Z","dateModified":"2025-12-06T09:05:40Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2287},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":7},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":20}]}},{"@type":"ListItem","position":17,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2190","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2190","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2190","headline":"Видовые квартиры в Ялте с собственным пляжем ЖК \"Юсуповский\" — ваша личная резиденция бизнес-класса на берегу…","articleBody":"Видовые квартиры в Ялте с собственным пляжем\n\nЖК \"Юсуповский\" — ваша личная резиденция бизнес-класса на берегу моря!\nЗдесь каждый элемент говорит о статусе: от величественного фасада до 2-этажного SPA и фитнес-центра на территории.\n\n✅ Панорамное остекление\n✅ Открытый подогреваемый бассейн и закрытый двор-парк 2 га\n✅ 2-этажные квартиры\n✅ Трансфер к пляжу\n✅ Реликтовый парк и водопад на территории.\n\nВсего в нескольких минутах езды: Ливадийский дворец, Солнечная тропа, ведущая вдоль побережья, а также лучшие рестораны и культурные, развлекательные объекты Ялты.\n\nЭто инвестиция в будущее: Ваш второй дом и источник вдохновения для будущих поколений.\n\nДо 30 ноября 2025 года вы можете купить квартиры в рассрочку 0%. Не упустите эту возможность! \n\nКупить\n\nПроектная декларация на сайте https://наш.дом.рф/. Застройщик: ООО СЗ ВОЛГА. Финансовые услуги оказывает: ПАО \"Сбербанк\".\n\n#реклама \ngk-yusupovskiy.ru\nО рекламодателе","datePublished":"2025-12-05T22:45:16Z","dateModified":"2025-12-07T20:52:11Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1348},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":2}]}},{"@type":"ListItem","position":18,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2189","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2189","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2189","headline":"🤔 Как делать HTML-форму? HTML-форма создается с помощью тега

, внутри которого размещаются элементы упр…","articleBody":"🤔 Как делать HTML-форму?\n\nHTML-форма создается с помощью тега , внутри которого размещаются элементы управления: , , , <button>. Атрибуты action и method указывают, куда и каким способом отправлять данные. Например, <form method=\"post\" action=\"/submit\">.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2025-12-05T16:10:38Z","dateModified":"2025-12-05T16:10:38Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2146},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":8},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":4}]}},{"@type":"ListItem","position":19,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2188","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2188","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2188","headline":"🤔 Как растянуть элемент на 100%? Чтобы растянуть элемент на 100% (по ширине, высоте или обоим направлениям),…","articleBody":"🤔 Как растянуть элемент на 100%?\n\nЧтобы растянуть элемент на 100% (по ширине, высоте или обоим направлениям), нужно понимать контекст, от чего \"100%\" будет вычисляться. Значение 100% в CSS основывается на родительском элементе. Рассмотрим различные случаи и подходы.\n\n🟠Растяжение элемента на 100% ширины (`width: 100%;`)\nЭлемент займет всю ширину своего родителя.\n<div style=\"width: 300px; background: lightblue;\">\n <div style=\"width: 100%; background: coral;\">Я растянут по ширине!</div>\n</div>\n\n🟠Растяжение элемента на 100% высоты (`height: 100%;`)\nЭлемент займет всю высоту родительского элемента.\n<div style=\"height: 300px; background: lightblue;\">\n <div style=\"height: 100%; background: coral;\">Я растянут по высоте!</div>\n</div>\n\n🟠Растяжение элемента на 100% ширины и высоты\nДля растяжения элемента как по ширине, так и по высоте относительно родителя используются width: 100%; и height: 100%;.\n<div style=\"width: 300px; height: 300px; background: lightblue;\">\n <div style=\"width: 100%; height: 100%; background: coral;\">Растянут по ширине и высоте!</div>\n</div>\n\n🟠Растяжение относительно окна браузера (`viewport`)\nЕсли элемент нужно растянуть на весь экран, используются единицы 100vw (ширина окна) и 100vh (высота окна).\n<div style=\"width: 100vw; height: 100vh; background: coral;\">\n Я растянут на весь экран!\n</div>\n\nДля исключения полосы прокрутки можно использовать\nwidth: calc(100vw - 16px); /* Учитывается ширина скролла */\n\n🟠Использование `position: absolute`\nКогда нужно растянуть элемент независимо от размера его содержимого, можно использовать position: absolute.\n<div style=\"position: relative; width: 300px; height: 300px; background: lightblue;\">\n <div style=\"position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: coral;\">\n Я растянут абсолютно!\n </div>\n</div>\n\n🟠Растяжение внутри Flexbox-контейнера\nFlexbox автоматически растягивает вложенные элементы, если у них указаны свойства flex: 1 или align-items: stretch.\n<div style=\"display: flex; width: 300px; height: 300px; background: lightblue;\">\n <div style=\"flex: 1; background: coral;\">Я растянут по Flexbox!</div>\n</div>\n\n🟠Растяжение внутри Grid-контейнера\nCSS Grid также позволяет растягивать элементы.\n<div style=\"display: grid; width: 300px; height: 300px; background: lightblue;\">\n <div style=\"width: 100%; height: 100%; background: coral;\">Я растянут внутри Grid!</div>\n</div>\n\n🟠Растяжение с учетом отступов\nЕсли нужно учесть отступы (padding) или границы (border), используйте свойство box-sizing: border-box. Это гарантирует, что элемент с width: 100% и height: 100% не будет \"выходить за пределы\" из-за отступов.\n<div style=\"width: 300px; height: 300px; background: lightblue;\">\n <div style=\"width: 100%; height: 100%; padding: 20px; box-sizing: border-box; background: coral;\">\n Я растянут с учетом отступов!\n </div>\n</div>\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-12-05T09:05:38Z","dateModified":"2025-12-05T09:05:38Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2351},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":6},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":21}]}},{"@type":"ListItem","position":20,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2187","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2187","mainEntityOfPage":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2187","headline":"🤔 Как добавить класс на элемент по условию? Если тебе нужно применять стили к элементу в зависимости от каког…","articleBody":"🤔 Как добавить класс на элемент по условию?\n\nЕсли тебе нужно применять стили к элементу в зависимости от какого-то состояния, Vue позволяет это сделать динамически. Ты просто указываешь, когда класс должен применяться, а когда нет. Это удобно для подсветки выбранных элементов, отображения ошибок или изменения внешнего вида по действиям пользователя.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2025-12-04T16:10:38Z","dateModified":"2025-12-04T16:10:38Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru","image":"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2126},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":8},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":5}]}}]}</script><div class="w-full flex-1"><div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3"><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n51dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b><u>🤔</u></b><b><u> Расскажи про memo в react</u></b> <code class="break-all">React.memo</code> — это функция в React, которая используется для оптимизации производительности функциональных компонентов. Она предотвращает ненужные повторные рендеры, если пропсы компонента не изменились. 🚩<b>Зачем нужен `React.memo`? </b> В React каждый раз, когда родительский компонент обновляется, все его дочерние компоненты тоже ререндерятся, даже если их пропсы остались неизменными. Это может негативно сказаться на производительности, особенно если дочерний компонент выполняет сложные вычисления или рендерит большое количество данных. <code class="break-all">React.memo</code> решает эту проблему, запоминая (мемоизируя) предыдущий результат рендера и сравнивая его с новыми пропсами. Если пропсы не изменились, компонент просто использует закэшированное представление, а не ререндерится. 🚩<b>Как использовать `React.memo`? </b> <code class="break-all">React.memo</code> — это функция высшего порядка (HOC), которая оборачивает функциональный компонент <pre class="whitespace-pre-line"><code class="language-jsx">import React from "react"; const MyComponent = ({ value }) => { console.log("Рендер компонента!"); return <div>Значение: {value}</div>; }; // Оборачиваем компонент в React.memo const MemoizedComponent = React.memo(MyComponent); export default MemoizedComponent;</code></pre> 🚩Пример без <code class="break-all">React.memo</code> vs. с <code class="break-all">React.memo</code> Допустим, у нас есть родительский компонент, который изменяет состояние при каждом клике <pre class="whitespace-pre-line"><code class="language-jsx">import React, { useState } from "react"; import MemoizedComponent from "./MyComponent"; const Parent = () => { const [count, setCount] = useState(0); return ( <div> <button onClick={() => setCount(count + 1)}>Увеличить</button> <MemoizedComponent value="Привет, мир!" /> </div> ); }; export default Parent;</code></pre> 🚩<b>Когда НЕ стоит использовать `React.memo`?</b> Если компонент всегда ререндерится из-за изменения пропсов – смысла в <code class="break-all">memo</code> нет. Если компонент рендерится быстро – оптимизация может быть ненужной, а проверка пропсов даже замедлит работу. Если пропсы часто изменяются – кэширование теряет смысл, так как все равно ререндерится. <b>Ставь </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>👍</b></a><b> и забирай </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>1.9k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>13</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>8</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n52dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="relative flex-none w-[132px]"><div class="flex gap-4"><div class="relative flex aspect-square h-[132px] w-full flex-none items-center justify-center bg-[#F6F7F8] rounded-[10px]" style="background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDZooooAKKQmmF8UDsSZoqHzM59qKdhE1IaWmscUgGO2KqySVLISexquY3c9Dj1q0hxkiaKRXGP4hRUP2fB+82fYUVVkJyRosqsMMAfrUMiKOiqPwoorOO5Mtiu2B0AH4UxJApIZRg+1FFbpJow5mSsu5P3Z2fToaKKKnbQq1z/2Q==);background-size:cover;background-position:center;background-repeat:no-repeat"><img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDZooooAKKQmmF8UDsSZoqHzM59qKdhE1IaWmscUgGO2KqySVLISexquY3c9Dj1q0hxkiaKRXGP4hRUP2fB+82fYUVVkJyRosqsMMAfrUMiKOiqPwoorOO5Mtiu2B0AH4UxJApIZRg+1FFbpJow5mSsu5P3Z2fToaKKKnbQq1z/2Q==" alt="" class="hidden"/><div class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-center bg-[#F6F7F8CC] rounded-[10px]"><i class="icon-play-line inline-flex leading-[0] text-[60px] text-icon-base-primary-disabled"></i></div></div><div class="relative flex flex-1"></div></div></div><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FNyi216er8DdRnM%2F%3Ferid%3Dj1SUmAVmvi49iZugd" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Бизнес 2026 — готовьтесь заранее</b></a> Масштабная конференция про главные изменения для бизнеса в 2026 г. Налоговая реформа, продажи, прибыль, команда и партнёрство: практические идеи от экспертов Битрикс24, Точка Банк, Bidzaar и Smartway. Участвуйте бесплатно — узнайте, что важно уже сейчас ✅ <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FYtn7DTaW8DdRnT%2F%3Ferid%3Dj1SUmAVmvi49iZugd" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Зарегистрироваться</b></a> #реклама 16+<a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FNyi216er8DdRnM%2F%3Ferid%3Dj1SUmAVmvi49iZugd" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"> business2026.ru</a> <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FPE2b0xvB8DdRnQ%2F%3Ferid%3Dj1SUmAVmvi49iZugd" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url">О рекламодателе</a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>1.2k</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n53dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b>🤔</b><b> Что такое прогрессивный рендеринг?</b> <span class="tg-spoiler"> Это подход, при котором контент страницы отрисовывается по мере загрузки, а не дожидаясь полной загрузки всех ресурсов. Улучшает скорость восприятия и пользовательский опыт.</span> Ставь 👍 если знал ответ, 🔥 если нет Забирай <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.0k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>5</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>9</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n54dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b><u>🤔</u></b><b><u> Основные причины отказа от классовых компонентов в react?</u></b> С появлением React Hooks в версии 16.8 (2019 год) классовые компоненты стали устаревшим способом создания компонентов. Сегодня функциональные компоненты с хуками заменяют классы. Давайте разберем почему. 🟠<b>Меньше кода → чище и понятнее</b> Функциональные компоненты короче, читаются легче, а код становится чище. <pre class="whitespace-pre-line"><code class="language-jsx">class Counter extends React.Component { constructor(props) { super(props); this.state = { count: 0 }; } increment = () => { this.setState({ count: this.state.count + 1 }); }; render() { return ( <button onClick={this.increment}> Счетчик: {this.state.count} </button> ); } }</code></pre> Функциональный компонент (хуки делают код проще) <pre class="whitespace-pre-line"><code class="language-jsx">function Counter() { const [count, setCount] = useState(0); return ( <button onClick={() => setCount(count + 1)}> Счетчик: {count} </button> ); }</code></pre> 🟠<b>Легче управлять жизненным циклом (useEffect vs componentDidMount)</b> В классах жизненный цикл* компонента состоит из нескольких методов (<code class="break-all">componentDidMount</code>, <code class="break-all">componentDidUpdate</code>, <code class="break-all">componentWillUnmount</code>). <pre class="whitespace-pre-line"><code class="language-jsx">class Timer extends React.Component { constructor(props) { super(props); this.state = { time: 0 }; } componentDidMount() { this.timer = setInterval(() => { this.setState({ time: this.state.time + 1 }); }, 1000); } componentWillUnmount() { clearInterval(this.timer); } render() { return <p>Время: {this.state.time} секунд</p>; } }</code></pre> Функциональный компонент (хуки делают все проще) <pre class="whitespace-pre-line"><code class="language-jsx">function Timer() { const [time, setTime] = useState(0); useEffect(() => { const timer = setInterval(() => setTime(t => t + 1), 1000); return () => clearInterval(timer); }, []); return <p>Время: {time} секунд</p>; }</code></pre> 🟠<b>Лучшая производительность (меньше потребления памяти)</b> Классовые компоненты используют экземпляры классов, а функциональные компоненты – просто функции. Создают экземпляры <code class="break-all">this</code> Обрабатывают <code class="break-all">setState</code> Хранят лишние связи и контексты Не создают <code class="break-all">this</code> Используют только нужные данные Оптимизируются через React.memo <pre class="whitespace-pre-line"><code class="language-jsx">const Button = React.memo(({ onClick }) => { console.log("Ререндер кнопки"); return <button onClick={onClick}>Нажми</button>; }); function App() { const [count, setCount] = useState(0); const increment = useCallback(() => setCount(c => c + 1), []); return ( <div> <p>Счетчик: {count}</p> <Button onClick={increment} /> </div> ); }</code></pre> 🟠<b>Легче переиспользовать логику (React Hooks vs HOC/Render Props)</b> Раньше в классах код переиспользовали через HOC и Render Props, но это делало код сложным. <pre class="whitespace-pre-line"><code class="language-jsx">function withLogging(WrappedComponent) { return class extends React.Component { componentDidMount() { console.log("Компонент монтирован"); } render() { return <WrappedComponent {...this.props} />; } }; }</code></pre> Хуки (<code class="break-all">useEffect</code>) делают код чище <pre class="whitespace-pre-line"><code class="language-jsx">function useLogger() { useEffect(() => console.log("Компонент монтирован"), []); } function MyComponent() { useLogger(); return <p>Привет, мир!</p>; }</code></pre> 🟠<b>Функциональные компоненты – будущее React</b> React официально рекомендует использовать функциональные компоненты Dan Abramov (разработчик React) Новые фичи React (Suspense, Server Components) создаются для функциональных компонентов Классы не работают в React Server Components Большинство современных библиотек (Redux Toolkit, React Query) рассчитаны на хуки <b>Ставь </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>👍</b></a><b> и забирай </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.1k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>15</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>8</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n55dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="relative flex-none w-[132px]"><img alt="Где вести задачи и проекты? Конечно, в Битрикс24 Бесплатный онлайн-сервис для бизнеса и совместной работы. Полный комплект дл" loading="lazy" width="96" height="96" decoding="async" data-nimg="1" class="avatar aspect-square h-full w-full rounded-lg object-cover avatar__circle avatar__96" style="color:transparent;--border-size:2px" src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwCG2jV7kLIPl5zk+1aKWVsx4AP0Y1TX5XDDqM1YE0jnarbCW7dh1roqyktURFLZlW5RYblkUYAx/KgW6/eU474qSSMyXLq5JOOSRxUJcxsVJJwcYzSjVvZCdO12W1VWXJGT0JoqKGTJxRVtNGdxtNHnCTdGM4p9LuGemPxpyjzKzOhqw3M5IJTn6moDBIZNzgA/Wre5fX+dN3D0z+NQqaTuRJu1gjXbRSZorRoyFxSo5TOMc0UUOKkrM7JIXzm9v1pruXxnHFFFQqUIu6Rixv40UUVoZNH/2Q=="/><div class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-center rounded-[4px] bg-[#F6F7F8CC]"><i class="icon-image-line inline-flex leading-[0] text-[60px] text-icon-base-primary-disabled"></i></div></div><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FGqFSTgn58D5Q5h%2F%3Ferid%3Dj1SUmVqo6zngvLRZK" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Где вести задачи и проекты? Конечно, в Битрикс24</b></a> Бесплатный онлайн-сервис для бизнеса и совместной работы. Полный комплект для работы без хаоса. <b>Ставьте первую задачу прямо сейчас</b> <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FjHVmRfOo8D5Q5w%2F%3Ferid%3Dj1SUmVqo6zngvLRZK" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Начать</b></a> #реклама 16+<a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FGqFSTgn58D5Q5h%2F%3Ferid%3Dj1SUmVqo6zngvLRZK" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"> task-24.bitrix24.ru</a> <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FZmWIsuy_8D5Q5o%2F%3Ferid%3Dj1SUmVqo6zngvLRZK" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url">О рекламодателе</a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>1.4k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>2</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n56dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b>🤔</b><b> Является ли Web Workers частью спецификации HTML5?</b> <span class="tg-spoiler"> Да, Web Workers — часть HTML5. Это механизм для многопоточности в браузере: выполнение кода в фоновом потоке, без блокировки UI.</span> Ставь 👍 если знал ответ, 🔥 если нет Забирай <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.1k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>5</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>11</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n57dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="relative flex-none w-[132px]"><div class="flex gap-4"><div class="relative flex aspect-square h-[132px] w-full flex-none items-center justify-center bg-[#F6F7F8] rounded-[10px]" style="background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAWACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwC+jbMlpC+e2Ki21HO2MjIAHXjNQnzXUiMyHj5TjFbRWlyOVydiztqOZtowMZI71USGcZ3LO/pk4/rSPazv0SQfVv8A69TzMFBJ6lhN7FVVunLZFFWYoSijJJbHPNFVclkzRIwO5QQfWmmEZGOAOwoorLyLI/swx1x26VKkIQ5zzRRQMftooooEf//Z);background-size:cover;background-position:center;background-repeat:no-repeat"><img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAWACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwC+jbMlpC+e2Ki21HO2MjIAHXjNQnzXUiMyHj5TjFbRWlyOVydiztqOZtowMZI71USGcZ3LO/pk4/rSPazv0SQfVv8A69TzMFBJ6lhN7FVVunLZFFWYoSijJJbHPNFVclkzRIwO5QQfWmmEZGOAOwoorLyLI/swx1x26VKkIQ5zzRRQMftooooEf//Z" alt="" class="hidden"/><div class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-center bg-[#F6F7F8CC] rounded-[10px]"><i class="icon-play-line inline-flex leading-[0] text-[60px] text-icon-base-primary-disabled"></i></div></div><div class="relative flex flex-1"></div></div></div><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FJaOQ9Xkg8CoS3S%2F%3Ferid%3Dj1SUmBEoGeyrNhKuT" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>В бигтехе есть место не только для разработчиков</b></a> В VK ценят каждого специалиста — от маркетологов до HR. По ссылке — истории сотрудников, которые меняют продукты компании без единой строчки кода. Смотрите ролики и вакансии, где вы точно сможете проявить себя. <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FdsZAFs1t8CoS4W%2F%3Ferid%3Dj1SUmBEoGeyrNhKuT" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Перейти на сайт</b></a> #реклама 16+<a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FJaOQ9Xkg8CoS3S%2F%3Ferid%3Dj1SUmBEoGeyrNhKuT" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"> vkteam.ru</a> <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2Fa3nKsnDS8CoS3n%2F%3Ferid%3Dj1SUmBEoGeyrNhKuT" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url">О рекламодателе</a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>1.6k</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n58dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b><u>🤔</u></b><b><u> Какие есть проблемы у di?</u></b> Dependency Injection (DI) — это паттерн, который упрощает управление зависимостями, но у него есть свои сложности и недостатки. 🟠<b>Усложнение кода и архитектуры</b> При использовании DI код может стать излишне сложным, особенно если внедрение зависимостей реализуется вручную или через сложные контейнеры. <pre class="whitespace-pre-line"><code class="language-js">class Service { constructor(repository) { this.repository = repository; } }</code></pre> 🟠<b>Производительность (затраты на создание объектов)</b> Если DI используется через контейнеры, они могут замедлять выполнение программы, так как: Создание объектов может занимать больше времени (особенно при ленивой инициализации). Поиск зависимостей в контейнере тоже требует времени. В Angular, NestJS и других фреймворках DI может потреблять больше ресурсов, чем обычное создание объектов. 🟠<b>Скрытая сложность и магия</b> Когда зависимости внедряются автоматически через контейнер, код становится менее очевидным. <pre class="whitespace-pre-line"><code class="language-ts">@Injectable() class Service { constructor(private readonly repository: Repository) {} }</code></pre> 🟠<b>Проблемы с тестированием</b> Хотя DI часто называют удобным для тестирования, на практике могут возникнуть сложности: Если контейнер создаёт объекты динамически, тесты могут работать нестабильно. Нужно явно мокать зависимости, что может усложнять настройку тестов. <pre class="whitespace-pre-line"><code class="language-js">class Service { constructor(repository) { this.repository = repository; } } const service = new Service(new Repository()); // Проблема при тестировании – жестко задана зависимость</code></pre> Здесь тестировать <code class="break-all">Service</code> сложно, потому что <code class="break-all">Repository</code> создаётся вручную. Приходится использовать мок-объекты <pre class="whitespace-pre-line"><code class="language-js">const mockRepository = { getData: () => "mock data" }; const service = new Service(mockRepository);</code></pre> 🟠<b>DI не всегда нужен</b> В маленьких проектах использование DI может быть излишним. Простое создание объектов может быть проще и понятнее, чем настройка DI-контейнера. <pre class="whitespace-pre-line"><code class="language-js">const repository = new Repository(); const service = new Service(repository);</code></pre> <b>Ставь </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>👍</b></a><b> и забирай </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.4k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>14</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>6</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n59dlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b>🤔</b><b> Что известно про memo в React?</b> <span class="tg-spoiler"> React.memo — это HOC (Higher-Order Component), который позволяет избежать лишнего рендера, если пропсы не изменились. React.memo сравнивает предыдущие и новые пропсы (shallow comparison) и перерисовывает компонент только при их изменении. Можно передать кастомную функцию сравнения как второй аргумент для тонкой настройки.</span> Ставь 👍 если знал ответ, 🔥 если нет Забирай <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.2k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>11</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>12</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5adlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="relative flex-none w-[132px]"><div class="flex gap-4"><div class="relative flex aspect-square h-[132px] w-full flex-none items-center justify-center bg-[#F6F7F8] rounded-[10px]" style="background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAWACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDSQcdFz7VJuHPT86jU9PmB/DFV5I2ZyQhOf9rFZzk1sOxJEWCgbf1xUu8kY2Ae+4VSZ13lTt3dx5tG9MZ3L05/eZrP2kuwWLBYdmU/Q0ViWiiO6jIOcqTRW1iW7G+rDGMsfc1L/h6UUVRT3KLWUEsm91JYjkhiKeNKtMfcb/vs0UUlsIZLYW9uhkjQhh33E0UUUMiW5//Z);background-size:cover;background-position:center;background-repeat:no-repeat"><img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAWACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDSQcdFz7VJuHPT86jU9PmB/DFV5I2ZyQhOf9rFZzk1sOxJEWCgbf1xUu8kY2Ae+4VSZ13lTt3dx5tG9MZ3L05/eZrP2kuwWLBYdmU/Q0ViWiiO6jIOcqTRW1iW7G+rDGMsfc1L/h6UUVRT3KLWUEsm91JYjkhiKeNKtMfcb/vs0UUlsIZLYW9uhkjQhh33E0UUUMiW5//Z" alt="" class="hidden"/><div class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-center bg-[#F6F7F8CC] rounded-[10px]"><i class="icon-play-line inline-flex leading-[0] text-[60px] text-icon-base-primary-disabled"></i></div></div><div class="relative flex flex-1"></div></div></div><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><u>📺</u><b> База 1000+ реальных собеседований </b>На программиста, тестировщика, аналитика, проджекта и другие IT профы. <u>Есть собесы от ведущих компаний:</u> Сбер, Яндекс, ВТБ, Тинькофф, Озон, Wildberries и т.д. 🎯 <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2F%2BOERl3d0TUkpiN2Uy" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url">Переходи по ссылке и присоединяйся к базе,</a> чтобы прокачать свои шансы на успешное трудоустройство!</div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.3k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>4</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5bdlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b><u>🤔</u></b><b><u> Для чего скрипт подключают в концe body?</u></b> Основная причина – ускорение загрузки страницы и избежание блокировки рендеринга. Когда браузер загружает HTML, он читает код сверху вниз. Если в <code class="break-all"><head></code> встречается <code class="break-all"><script></code>, браузер останавливает разбор HTML, загружает и выполняет скрипт, а только потом продолжает загружать страницу. 🟠<b>Проблема: блокировка рендеринга</b> Если скрипт загружается в <code class="break-all"><head></code>, он останавливает отрисовку страницы до завершения загрузки. <pre class="whitespace-pre-line"><code class="language-html"><head> <script src="script.js"></script> <!-- ❌ Плохо: блокирует рендеринг --> </head> <body> <h1>Сайт загружается...</h1> </body></code></pre> 🟠<b>Решение: подключение в конце `<body>`</b> Если разместить <code class="break-all"><script></code> перед закрывающим <code class="break-all"></body></code>, сначала загружается контент страницы, а потом выполняется JavaScript. <pre class="whitespace-pre-line"><code class="language-html"><body> <h1>Контент загрузился!</h1> <script src="script.js"></script> <!-- Хорошо: не блокирует рендеринг --> </body></code></pre> 🟠<b>Альтернативы: `defer` и `async`</b> <code class="break-all">defer</code> – отложенное выполнение после загрузки HTML <pre class="whitespace-pre-line"><code class="language-html"><head> <script src="script.js" defer></script> </head></code></pre> <code class="break-all">async</code> – загрузка и выполнение параллельно <pre class="whitespace-pre-line"><code class="language-html"><head> <script src="script.js" async></script> </head></code></pre> <b>Ставь </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>👍</b></a><b> и забирай </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.2k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>17</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>8</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5cdlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="relative flex-none w-[132px]"><img alt="Тютю-гребень или капикрыса? Побалуйте себя роскошью от Ричарда Сапогова или утепляйтесь с культовой рубашкой Инженера. Выбира" loading="lazy" width="96" height="96" decoding="async" data-nimg="1" class="avatar aspect-square h-full w-full rounded-lg object-cover avatar__circle avatar__96" style="color:transparent;--border-size:2px" src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwCBPI8r587/AGpreXjjfn3FMUEnirYnPG7zM4wcY/wppWEVDjtnFAx3q2JuST5n/jtK052nG/Pb7v8AhTApnHbNFKQQeaKAGVeit4Wtd53FiPXpVWNUKFnPPYVLG7lQg6HtSYECIXkC7to9cZqXyGWUxuwU9ie9Rs5hnBxtx3NOnWRmEjZO7o3alcfQJYzFIUJB9x3ophzjmiqAaCMcdamjY8Zfbt6UUUhDnGW8x5AR0BUc1AshHyEkr2oopDJOoyelFFFUgP/Z"/><div class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-center rounded-[4px] bg-[#F6F7F8CC]"><i class="icon-image-line inline-flex leading-[0] text-[60px] text-icon-base-primary-disabled"></i></div></div><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FHslyz_Or8C7apR%2F%3Ferid%3Dj1SUnWrBzHHjhUyZ3" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Тютю-гребень или капикрыса?</b></a> Побалуйте себя роскошью от Ричарда Сапогова или утепляйтесь с культовой рубашкой Инженера. Выбирайте фаворитов из коллекции с персонажами Антона Лапенко. <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FqDHG8R9i8C7aqv%2F%3Ferid%3Dj1SUnWrBzHHjhUyZ3" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Перейти на сайт</b></a> #реклама <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FHslyz_Or8C7apR%2F%3Ferid%3Dj1SUnWrBzHHjhUyZ3" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"> tbank.ru</a> <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FVRKg5F8a8C7aqn%2F%3Ferid%3Dj1SUnWrBzHHjhUyZ3" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url">О рекламодателе</a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>1.5k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>2</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5ddlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b>🤔</b><b> Что известно про graceful shutdown и где применяется?</b> <span class="tg-spoiler"> Graceful shutdown — это корректное завершение работы приложения: - Завершение активных соединений; - Очистка ресурсов (например, соединений с БД); - Применяется в серверных приложениях, микросервисах, особенно при развертывании и обновлении.</span> Ставь 👍 если знал ответ, 🔥 если нет Забирай <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.1k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>4</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>5</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5edlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b><u>🤔</u></b><b><u> Какие используешь подходы для написания приложения которую проще поддерживать, чем делать первоначальную разработку?</u></b> При разработке frontend-приложений, которые в будущем будет проще поддерживать и масштабировать, я придерживаюсь ряда ключевых подходов. 🟠<b>Разделение ответственности (Separation of Concerns)</b> Это значит, что код должен быть разделен по зонам ответственности. В frontend-разработке это проявляется в: Чистом разделении логики, представления и данных (например, с помощью архитектуры MVC, MVVM или FLUX). Использовании компонентов в React/Vue или шаблонов в Angular. Разделении CSS, JS и HTML, либо использовании методологий, где стили хранятся рядом с компонентом (CSS Modules, Styled Components). Вместо того, чтобы писать всю логику и разметку в одном файле: <pre class="whitespace-pre-line"><code class="language-jsx">function App() { const [count, setCount] = useState(0); return <button onClick={() => setCount(count + 1)}>Count: {count}</button>; }</code></pre> Я разделяю бизнес-логику и представление <pre class="whitespace-pre-line"><code class="language-jsx">// CounterLogic.js export function useCounter() { const [count, setCount] = useState(0); const increment = () => setCount(count + 1); return { count, increment }; } // Counter.js import { useCounter } from "./CounterLogic"; function Counter() { const { count, increment } = useCounter(); return <button onClick={increment}>Count: {count}</button>; }</code></pre> 🟠<b>Компонентный подход и повторное использование кода</b> Frontend-приложения должны строиться из переиспользуемых и изолированных компонентов. Это уменьшает дублирование кода и делает его понятным. <pre class="whitespace-pre-line"><code class="language-jsx">// Button.js (переиспользуемый компонент) function Button({ onClick, children }) { return <button onClick={onClick}>{children}</button>; } // Counter.js (использует Button) function Counter() { const [count, setCount] = useState(0); return <Button onClick={() => setCount(count + 1)}>Count: {count}</Button>; }</code></pre> 🟠<b>Чистый код и читаемость</b> Код должен быть понятным не только мне, но и другим разработчикам. Понятные имена переменных и функций. Вместо <code class="break-all">x</code> → <code class="break-all">userAge</code>, вместо <code class="break-all">doSmth()</code> → <code class="break-all">calculateTotalPrice()</code>. Меньше вложенности. Вместо кучи <code class="break-all">if</code> и <code class="break-all">else</code>, лучше использовать <code class="break-all">early return</code>. Разбиение кода на модули. Один файл = одна зона ответственности. <pre class="whitespace-pre-line"><code class="language-js">function getDiscountedPrice(price, discount) { if (discount <= 0) return price; return price - price * (discount / 100); }</code></pre> 🟠<b>Состояние приложения: локальное vs глобальное</b> В зависимости от сложности приложения нужно правильно управлять состоянием: Локальное состояние – <code class="break-all">useState</code> (React), <code class="break-all">ref</code> (Vue) для простых данных внутри компонента. Глобальное состояние – Redux, MobX, Zustand, Pinia, Context API – когда данные нужны многим компонентам. Серверное состояние – React Query, SWR – когда данные приходят с API и их нужно кешировать. 🟠<b>Следование принципам SOLID и DRY</b> DRY (Don't Repeat Yourself) – не повторяем код, используем функции, хуки, компоненты. SOLID – например, принцип единственной ответственности (Single Responsibility Principle) гласит, что каждый компонент или функция должны решать только одну задачу. <pre class="whitespace-pre-line"><code class="language-js">function sendEmailAndSaveToDB(user) { sendEmail(user.email); saveUserToDatabase(user); }</code></pre> Лучше разделить логику <pre class="whitespace-pre-line"><code class="language-js">function sendEmail(email) { /* отправка письма */ } function saveUserToDatabase(user) { /* сохранение в БД */ } function registerUser(user) { sendEmail(user.email); saveUserToDatabase(user); }</code></pre> 🟠<b>Использование TypeScript</b> TypeScript помогает избежать ошибок и делать код предсказуемым. <pre class="whitespace-pre-line"><code class="language-ts">type User = { id: number; name: string; }; function getUserName(user: User): string { return user.name; }</code></pre> 🟠<b>Документация и кодстайл</b> ESLint + Prettier → автоформатирование и проверка стиля. JSDoc/TypeScript → документация функций и типов данных. Storybook → для документирования UI-компонентов. <b>Ставь </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>👍</b></a><b> и забирай </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.1k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>21</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>3</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5fdlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b>🤔</b><b> Как использовать селектор?</b> <span class="tg-spoiler"> Селектор в CSS используется для выбора элементов по тегу, классу, ID или атрибуту. В JS селекторы используются через document.querySelector() или useRef в React.</span> Ставь 👍 если знал ответ, 🔥 если нет Забирай <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.0k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>4</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>7</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5gdlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div>🤔 <u><b>В чем различие методов call apply bind?</b> </u> Методы call, apply и bind принадлежат к функциональному объекту <code class="break-all">Function</code> и используются для указания контекста <code class="break-all">this</code> при вызове функции. Хотя все три метода позволяют контролировать значение <code class="break-all">this</code> внутри функции, между ними существуют ключевые различия в способе использования и поведении. 🚩<b>Сall</b> Вызывает функцию, явно устанавливая <code class="break-all">this</code> в первом аргументе. Остальные аргументы передаются в вызываемую функцию как есть. <pre class="whitespace-pre-line"><code class="language-javascript">function greet(message, name) { console.log(${message}, ${name}. This is ${this}); } greet.call("Earth", "Hello", "Alice"); // "Hello, Alice. This is Earth"</code></pre> 🚩<b>Apply</b> Очень похож на <code class="break-all">call</code>, но принимает аргументы в виде массива, а не по отдельности. <pre class="whitespace-pre-line"><code class="language-javascript">function greet(message, name) { console.log( ${message}, ${name}. This is ${this} ); } greet.apply("Earth", ["Hello", "Alice"]); // "Hello, Alice. This is Earth"</code></pre> 🚩<b>Bind</b> Создаёт новую функцию, которая, когда она вызывается, имеет установленный контекст <code class="break-all">this</code>, указанный в первом аргументе. В отличие от <code class="break-all">call</code> и <code class="break-all">apply</code>, <code class="break-all">bind</code> не вызывает функцию сразу, а возвращает новую функцию, которую можно вызвать позже. <pre class="whitespace-pre-line"><code class="language-javascript">function greet(message, name) { console.log( ${message}, ${name}. This is ${this} ); } const greetEarth = greet.bind("Earth", "Hello", "Alice"); greetEarth(); // "Hello, Alice. This is Earth"</code></pre> <b>Ставь </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>👍</b></a><b> и забирай </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.3k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>20</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>7</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5hdlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="relative flex-none w-[132px]"><img alt="Видовые квартиры в Ялте с собственным пляжем ЖК "Юсуповский" — ваша личная резиденция бизнес-класса на берегу моря! Здесь каж" loading="lazy" width="96" height="96" decoding="async" data-nimg="1" class="avatar aspect-square h-full w-full rounded-lg object-cover avatar__circle avatar__96" style="color:transparent;--border-size:2px" src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwCFUyuc0vle9NVWPQZpdj+lZAK0RUgAgk+lPFuccnBp9pHmQlh0HFSNwTkgYPerSXUVrlR4yh56UVYuCpRgOwz+tFTJK+gWZXTG05A/E0b1/uCmjHeg47VIFuyw0j8AfLTJn+dlJ6H0os3CM+TgleKrzNuck5JrRbDJW/j9Ng6fUUVCkmC4P8S4H5g0UnqAoJHfFLkkYzxRRUCG9wQcEHNGPU5oop30GNEYBzknFFFFK4H/2Q=="/><div class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-center rounded-[4px] bg-[#F6F7F8CC]"><i class="icon-image-line inline-flex leading-[0] text-[60px] text-icon-base-primary-disabled"></i></div></div><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FEI8BlF908B6kb6%2F%3Ferid%3Dj1SUn1uhGqMB7JjJH" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Видовые квартиры в Ялте с собственным пляжем</b></a> ЖК "Юсуповский" — ваша личная резиденция бизнес-класса на берегу моря! Здесь каждый элемент говорит о статусе: от величественного фасада до 2-этажного SPA и фитнес-центра на территории. ✅ Панорамное остекление ✅ Открытый подогреваемый бассейн и закрытый двор-парк 2 га ✅ 2-этажные квартиры ✅ Трансфер к пляжу ✅ Реликтовый парк и водопад на территории. Всего в нескольких минутах езды: Ливадийский дворец, Солнечная тропа, ведущая вдоль побережья, а также лучшие рестораны и культурные, развлекательные объекты Ялты. Это инвестиция в будущее: Ваш второй дом и источник вдохновения для будущих поколений. До 30 ноября 2025 года вы можете купить квартиры в рассрочку 0%. Не упустите эту возможность! <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2Fr6vEKZA_8B6kbE%2F%3Ferid%3Dj1SUn1uhGqMB7JjJH" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Купить</b></a> <i>Проектная декларация на сайте </i><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2F%D0%BD%D0%B0%D1%88.%D0%B4%D0%BE%D0%BC.%D1%80%D1%84%2F" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><i>https://наш.дом.рф/</i></a><i>. Застройщик: ООО СЗ ВОЛГА. Финансовые услуги оказывает: ПАО "Сбербанк".</i> #реклама <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2FEI8BlF908B6kb6%2F%3Ferid%3Dj1SUn1uhGqMB7JjJH" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"> gk-yusupovskiy.ru</a> <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Fya.cc%2Ft%2Fziuv475H8B6kbC%2F%3Ferid%3Dj1SUn1uhGqMB7JjJH" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url">О рекламодателе</a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>1.3k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>2</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5idlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div>🤔 <b>Как делать HTML-форму?</b> <span class="tg-spoiler">HTML-форма создается с помощью тега <form>, внутри которого размещаются элементы управления: <input>, <select>, <textarea>, <button>. Атрибуты action и method указывают, куда и каким способом отправлять данные. Например, <form method="post" action="</span><span class="tg-spoiler">/submit</span><span class="tg-spoiler">">.</span> Ставь 👍 если знал ответ, 🔥 если нет Забирай <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.1k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>4</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>8</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5jdlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b><u>🤔</u></b><b><u> Как растянуть элемент на 100%?</u></b> Чтобы растянуть элемент на 100% (по ширине, высоте или обоим направлениям), нужно понимать контекст, от чего "100%" будет вычисляться. Значение <code class="break-all">100%</code> в CSS основывается на родительском элементе. Рассмотрим различные случаи и подходы. 🟠<b>Растяжение элемента на 100% ширины (`width: 100%;`)</b> Элемент займет всю ширину своего родителя. <pre class="whitespace-pre-line"><code class="language-html"><div style="width: 300px; background: lightblue;"> <div style="width: 100%; background: coral;">Я растянут по ширине!</div> </div></code></pre> 🟠<b>Растяжение элемента на 100% высоты (`height: 100%;`)</b> Элемент займет всю высоту родительского элемента. <pre class="whitespace-pre-line"><code class="language-html"><div style="height: 300px; background: lightblue;"> <div style="height: 100%; background: coral;">Я растянут по высоте!</div> </div></code></pre> 🟠<b>Растяжение элемента на 100% ширины и высоты</b> Для растяжения элемента как по ширине, так и по высоте относительно родителя используются <code class="break-all">width: 100%;</code> и <code class="break-all">height: 100%;</code>. <pre class="whitespace-pre-line"><code class="language-html"><div style="width: 300px; height: 300px; background: lightblue;"> <div style="width: 100%; height: 100%; background: coral;">Растянут по ширине и высоте!</div> </div></code></pre> 🟠<b>Растяжение относительно окна браузера (`viewport`)</b> Если элемент нужно растянуть на весь экран, используются единицы <code class="break-all">100vw</code> (ширина окна) и <code class="break-all">100vh</code> (высота окна). <pre class="whitespace-pre-line"><code class="language-html"><div style="width: 100vw; height: 100vh; background: coral;"> Я растянут на весь экран! </div></code></pre> Для исключения полосы прокрутки можно использовать <pre class="whitespace-pre-line"><code class="language-css">width: calc(100vw - 16px); /* Учитывается ширина скролла */</code></pre> 🟠<b>Использование `position: absolute`</b> Когда нужно растянуть элемент независимо от размера его содержимого, можно использовать <code class="break-all">position: absolute</code>. <pre class="whitespace-pre-line"><code class="language-html"><div style="position: relative; width: 300px; height: 300px; background: lightblue;"> <div style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: coral;"> Я растянут абсолютно! </div> </div></code></pre> 🟠<b>Растяжение внутри Flexbox-контейнера</b> Flexbox автоматически растягивает вложенные элементы, если у них указаны свойства <code class="break-all">flex: 1</code> или <code class="break-all">align-items: stretch</code>. <pre class="whitespace-pre-line"><code class="language-html"><div style="display: flex; width: 300px; height: 300px; background: lightblue;"> <div style="flex: 1; background: coral;">Я растянут по Flexbox!</div> </div></code></pre> 🟠<b>Растяжение внутри Grid-контейнера</b> CSS Grid также позволяет растягивать элементы. <pre class="whitespace-pre-line"><code class="language-html"><div style="display: grid; width: 300px; height: 300px; background: lightblue;"> <div style="width: 100%; height: 100%; background: coral;">Я растянут внутри Grid!</div> </div></code></pre> 🟠<b>Растяжение с учетом отступов</b> Если нужно учесть отступы (padding) или границы (border), используйте свойство <code class="break-all">box-sizing: border-box</code>. Это гарантирует, что элемент с <code class="break-all">width: 100%</code> и <code class="break-all">height: 100%</code> не будет "выходить за пределы" из-за отступов. <pre class="whitespace-pre-line"><code class="language-html"><div style="width: 300px; height: 300px; background: lightblue;"> <div style="width: 100%; height: 100%; padding: 20px; box-sizing: border-box; background: coral;"> Я растянут с учетом отступов! </div> </div></code></pre> <b>Ставь </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>👍</b></a><b> и забирай </b><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.4k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>21</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>6</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div><div class="flex h-full flex-1"><div class="w-full @container/post"><div class="space-y-4 rounded-lg border border-border-base-secondary p-4 shadow-sm flex h-full cursor-pointer flex-col hover:bg-bg-base-secondary"><div class="flex items-center gap-2 border-b border-border-base-secondary pb-4"><div class="grid flex-1"><div class="channel-name flex items-center channel-name_30 "><div class="relative flex-none"><img alt="Frontend | Вопросы собесов" loading="lazy" width="30" height="30" decoding="async" data-nimg="1" class="avatar channel-name__avatar aspect-square avatar__circle avatar__30" style="color:transparent;--border-size:1px" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=32&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F25KaBb%2F5431453649143450783%3Fty%3Dx&w=64&q=75"/></div><div class="channel-name__content relative"><div class="channel-name__header flex items-center"><span class="grid"><a target="_blank" class="channel-name__title" href="/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></span><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><div></div></button></div><div class="channel-name__attributes flex items-center"><div class="channel-name__attribute flex items-center"><i class="icon-two-users-line inline-flex leading-[0] mr-1"></i><span>17 861</span></div></div></div></div></div><div><div class="relative" data-headlessui-state=""><div id="headlessui-menu-button-_R_3n5kdlfiutpfiurj9fivb_" aria-haspopup="menu" aria-expanded="false" data-headlessui-state=""><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_none button_small button__icon-only"><i class="icon-dots-horizontal-line inline-flex leading-[0] button__icon button__icon-only"></i></button></div></div></div></div><div class="mb-3 mt-3 w-full flex-1 rounded-lg pb-3"><div class="flex gap-4 min-h-[132px]"><div class="my-1.5 flex flex-1 flex-col gap-3 divide-y-[1px] divide-border-base-secondary"><div class="flex flex-1 flex-col gap-y-[6px]"><div class="relative flex-1"><div class="line-clamp-6 overflow-wrap-anywhere whitespace-pre-line break-words"><div><b>🤔</b><b> Как добавить класс на элемент по условию?</b> <span class="tg-spoiler"> Если тебе нужно применять стили к элементу в зависимости от какого-то состояния, Vue позволяет это сделать динамически. Ты просто указываешь, когда класс должен применяться, а когда нет. Это удобно для подсветки выбранных элементов, отображения ошибок или изменения внешнего вида по действиям пользователя.</span> Ставь 👍 если знал ответ, 🔥 если нет Забирай <a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feo_test_task_bot" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>📚 </b></a><a class="text-primary break-all" href="https://go.tlmtr.io/go?from=channel&url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596" rel="noopener noreferrer nofollow" target="_blank" aria-label="link to url"><b>Базу знаний</b></a></div></div></div></div></div></div></div><div class="flex flex-col gap-2"><div class="flex justify-between"><div class="text-xs font-medium text-text-base-secondary"></div></div><div class="flex flex-col flex-wrap items-start justify-between gap-x-4 gap-y-4 border-t border-border-base-secondary pt-3 @sm/post:flex-row @sm/post:items-center"><div class="w-full flex-1 items-baseline justify-start whitespace-nowrap @sm/post:w-auto @sm/post:flex-none"><p class="flex items-center gap-x-2 text-xs font-medium text-text-base-secondary"><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-eye-line inline-flex leading-[0] text-base"></i>2.1k</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-arrow-repost-line inline-flex leading-[0] text-base"></i>5</span></button><button type="button" data-state="closed" class="flex-1 @sm/post:flex-auto" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><span class="inline-flex w-full items-center justify-center gap-0.5 rounded-md bg-bg-base-secondary p-[5px] pl-1 @sm/post:w-auto @sm/post:justify-start"><i class="icon-thumbs-up-line inline-flex leading-[0] text-base"></i>8</span></button></p></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_xxsmall z-[1] w-full @sm/post:w-auto"><span data-state="closed">التحليلات</span><i class="icon-chevron-right-line inline-flex leading-[0] button__icon"></i></button></div></div></div></div></div></div><button class="button button-border select-none whitespace-nowrap focus-visible:bg-bg-base-tertiary focus-visible:outline-none button_secondary button_medium mt-6 w-full"><i class="icon-chevron-down-line inline-flex leading-[0] button__icon"></i><a class="pointer-events-none flex items-center" href="/ar/channels/1917151177-easy_javascript_ru/posts?cursor=IKgF" rel="next">إظهار المزيد</a></button></div></div><!--$--><!--/$--></div><nav aria-label="Breadcrumb" class="hidden"><ol class="breadcrumb"><li><a href="https://telemetr.io">Telemetrio</a></li><li><a href="https://telemetr.io/ar/catalog/russia">روسيا</a></li><li><a href="https://telemetr.io/ar/catalog/russia/technology-and-applications">التكنولوجيات والتطبيقات</a></li><li><a href="https://telemetr.io/ar/channels/1917151177-easy_javascript_ru">Frontend | Вопросы собесов</a></li></ol><script type="application/ld+json">{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Telemetrio","item":"https://telemetr.io"},{"@type":"ListItem","position":2,"name":"روسيا","item":"https://telemetr.io/ar/catalog/russia"},{"@type":"ListItem","position":3,"name":"التكنولوجيات والتطبيقات","item":"https://telemetr.io/ar/catalog/russia/technology-and-applications"},{"@type":"ListItem","position":4,"name":"Frontend | Вопросы собесов","item":"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru"}]}</script></nav></main><footer class="main-footer container border-t border-border-base-secondary bg-bg-base-primary px-6 pb-5 pt-7 text-sm text-text-link-base xl:px-11 xl:pt-10"><div class="relative flex flex-col justify-between gap-x-9 gap-y-9 pb-10 min-[414px]:pb-11 md:gap-y-10 md:pb-12 lg:gap-y-9 xl:flex-row"><div class="flex flex-1 flex-wrap items-center justify-between gap-y-2 min-[1070px]:gap-x-10 xl:flex-col xl:items-start xl:justify-normal"><div class="-my-0.5 flex min-[414px]:basis-[44%] min-[1070px]:basis-0 xl:mb-4"><a class="-m-1.5 p-1.5" href=""><p class="sr-only">Telemetrio</p><span class="group flex items-center gap-3" id="logo"><div class="main-logo__icon relative flex items-center justify-center"><div class="hidden group-hover:flex"><div class="absolute bottom-[20%] left-[17%] items-center justify-center Loader_loading-container__833ya"><div class="mb-0 h-4.5 w-[20.8px] Loader_loading__MZ9UM"><div class="flex rounded bg-[#F5C324] Loader_line-sm__dMvr1"></div><div class="flex rounded bg-[#2DB6F5] Loader_line-sm__dMvr1"></div><div class="flex rounded bg-[#006DDA] Loader_line-sm__dMvr1"></div></div></div></div><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="29" height="29" rx="5.5" class="fill-bg-base-primary"></rect><rect x="0.5" y="0.5" width="29" height="29" rx="5.5" class="stroke-border-base-secondary"></rect><path class="group-hover:hidden" id="blueLine" d="M21.7339 10.1133C22.9787 10.1133 24.0001 11.2254 24.0001 12.5758V21.5361C24.0001 22.9023 22.9947 23.9985 21.7339 23.9985C20.4891 23.9985 19.4678 22.8864 19.4678 21.5361V12.5917C19.4678 11.2254 20.4732 10.1133 21.7339 10.1133Z" fill="#006DDA"></path><path class="group-hover:hidden" id="lightBlueLine" d="M14.9995 6C16.2443 6 17.2657 7.04854 17.2657 8.31951V21.6805C17.2657 22.9673 16.2603 24 14.9995 24C13.7548 24 12.7334 22.9515 12.7334 21.6805V8.33539C12.7334 7.04854 13.7548 6 14.9995 6Z" fill="#2DB6F5"></path><path class="group-hover:hidden" id="yellowLine" d="M8.26517 14.7539C9.50996 14.7539 10.5313 15.866 10.5313 17.2164V21.5377C10.5313 22.9039 9.52591 24.0001 8.26517 24.0001C7.02039 24.0001 5.99902 22.8881 5.99902 21.5377V17.2164C6.01498 15.866 7.02039 14.7539 8.26517 14.7539Z" fill="#F5C324"></path></svg></div><svg class="main-logo__text text-text-base-primary" xmlns="http://www.w3.org/2000/svg" width="123" height="18" viewBox="0 0 123 18" fill="none"><path d="M11.9257 0.523385V3.0956H7.31912V17.3597H4.62999V3.0956H0V0.523385H11.9257Z" fill="currentColor"></path><path d="M14.8065 12.2854C14.9936 13.174 15.4223 13.8599 16.0926 14.3432C16.7629 14.8109 17.5814 15.0447 18.5479 15.0447C19.8886 15.0447 20.8941 14.5614 21.5644 13.5949L23.6456 14.8109C22.492 16.5101 20.7849 17.3597 18.5245 17.3597C16.6226 17.3597 15.0871 16.7829 13.9179 15.6293C12.7487 14.4601 12.1641 12.9869 12.1641 11.2098C12.1641 9.46378 12.7409 8.00619 13.8945 6.837C15.0481 5.65222 16.5291 5.05983 18.3374 5.05983C20.0523 5.05983 21.4553 5.66002 22.5465 6.86039C23.6534 8.06075 24.2068 9.51834 24.2068 11.2332C24.2068 11.4982 24.1756 11.8489 24.1132 12.2854H14.8065ZM14.7831 10.2276H21.6579C21.4865 9.27671 21.0889 8.55961 20.4654 8.07634C19.8574 7.59308 19.1403 7.35144 18.3141 7.35144C17.3787 7.35144 16.5992 7.60867 15.9757 8.12311C15.3521 8.63755 14.9546 9.33907 14.7831 10.2276Z" fill="currentColor"></path><path d="M27.5981 17.3597V1.45727L30.1236 0.521922V17.3597H27.5981Z" fill="currentColor"></path><path d="M36.2127 12.2854C36.3998 13.174 36.8285 13.8599 37.4988 14.3432C38.1691 14.8109 38.9876 15.0447 39.9541 15.0447C41.2948 15.0447 42.3003 14.5614 42.9706 13.5949L45.0518 14.8109C43.8982 16.5101 42.1911 17.3597 39.9307 17.3597C38.0288 17.3597 36.4933 16.7829 35.3241 15.6293C34.1549 14.4601 33.5703 12.9869 33.5703 11.2098C33.5703 9.46378 34.1471 8.00619 35.3007 6.837C36.4543 5.65222 37.9353 5.05983 39.7436 5.05983C41.4585 5.05983 42.8615 5.66002 43.9527 6.86039C45.0596 8.06075 45.613 9.51834 45.613 11.2332C45.613 11.4982 45.5818 11.8489 45.5194 12.2854H36.2127ZM36.1893 10.2276H43.0641C42.8927 9.27671 42.4951 8.55961 41.8716 8.07634C41.2636 7.59308 40.5465 7.35144 39.7203 7.35144C38.7849 7.35144 38.0054 7.60867 37.3819 8.12311C36.7583 8.63755 36.3608 9.33907 36.1893 10.2276Z" fill="currentColor"></path><path d="M61.7719 4.89615C63.097 4.89615 64.1648 5.32485 64.9755 6.18226C65.7861 7.03966 66.1914 8.19326 66.1914 9.64305V17.3597H63.666V9.80674C63.666 8.99611 63.4633 8.37254 63.058 7.93604C62.6527 7.48395 62.0993 7.25791 61.3977 7.25791C60.6183 7.25791 59.9947 7.51513 59.527 8.02957C59.075 8.54402 58.8489 9.31568 58.8489 10.3446V17.3597H56.3235V9.80674C56.3235 8.99611 56.1286 8.37254 55.7389 7.93604C55.3647 7.48395 54.8269 7.25791 54.1254 7.25791C53.3615 7.25791 52.7379 7.52293 52.2547 8.05296C51.7714 8.5674 51.5298 9.33127 51.5298 10.3446V17.3597H49.0043V5.20014H51.5298V6.60316C52.2781 5.46515 53.3927 4.89615 54.8737 4.89615C56.3702 4.89615 57.4771 5.51192 58.1942 6.74347C58.9736 5.51192 60.1662 4.89615 61.7719 4.89615Z" fill="currentColor"></path><path d="M72.0511 12.2854C72.2381 13.174 72.6668 13.8599 73.3372 14.3432C74.0075 14.8109 74.8259 15.0447 75.7925 15.0447C77.1331 15.0447 78.1386 14.5614 78.809 13.5949L80.8901 14.8109C79.7365 16.5101 78.0295 17.3597 75.7691 17.3597C73.8672 17.3597 72.3317 16.7829 71.1625 15.6293C69.9933 14.4601 69.4087 12.9869 69.4087 11.2098C69.4087 9.46378 69.9855 8.00619 71.1391 6.837C72.2927 5.65222 73.7737 5.05983 75.582 5.05983C77.2968 5.05983 78.6998 5.66002 79.7911 6.86039C80.8979 8.06075 81.4513 9.51834 81.4513 11.2332C81.4513 11.4982 81.4202 11.8489 81.3578 12.2854H72.0511ZM72.0277 10.2276H78.9025C78.731 9.27671 78.3335 8.55961 77.7099 8.07634C77.102 7.59308 76.3848 7.35144 75.5586 7.35144C74.6233 7.35144 73.8438 7.60867 73.2202 8.12311C72.5967 8.63755 72.1992 9.33907 72.0277 10.2276Z" fill="currentColor"></path><path d="M91.0014 7.63205H88.1018V13.7118C88.1018 14.1951 88.211 14.5459 88.4292 14.7641C88.6474 14.9668 88.967 15.0837 89.3879 15.1149C89.8244 15.1304 90.3623 15.1227 91.0014 15.0915V17.3597C89.0684 17.5935 87.6809 17.4298 86.8391 16.8686C85.9973 16.2918 85.5764 15.2396 85.5764 13.7118V7.63205H83.4251V5.20014H85.5764V1.27167L88.1018 0.523385V5.20014H91.0014V7.63205Z" fill="currentColor"></path><path d="M97.1007 7.16437C97.7399 5.71458 98.9403 4.98968 100.702 4.98968V7.72559C99.7353 7.66323 98.8935 7.89707 98.1764 8.4271C97.4593 8.94154 97.1007 9.79895 97.1007 10.9993V17.3597H94.5753V5.20014H97.1007V7.16437Z" fill="currentColor"></path><path d="M106.005 3.25929C105.693 3.57107 105.319 3.72696 104.883 3.72696C104.446 3.72696 104.064 3.57107 103.737 3.25929C103.425 2.93191 103.269 2.54998 103.269 2.11348C103.269 1.67698 103.425 1.30284 103.737 0.99106C104.049 0.663687 104.431 0.5 104.883 0.5C105.335 0.5 105.717 0.663687 106.029 0.99106C106.34 1.30284 106.496 1.67698 106.496 2.11348C106.496 2.54998 106.333 2.93191 106.005 3.25929ZM103.737 17.3597V6.13549L106.262 5.20014V17.3597H103.737Z" fill="currentColor"></path><path d="M116.007 17.5C114.292 17.5 112.834 16.9076 111.634 15.7228C110.434 14.5381 109.834 13.0805 109.834 11.3501C109.834 9.61967 110.434 8.16208 111.634 6.97731C112.834 5.79253 114.292 5.20014 116.007 5.20014C117.737 5.20014 119.195 5.79253 120.38 6.97731C121.58 8.16208 122.18 9.61967 122.18 11.3501C122.18 13.0805 121.58 14.5381 120.38 15.7228C119.195 16.9076 117.737 17.5 116.007 17.5ZM113.411 13.9924C114.113 14.6939 114.978 15.0447 116.007 15.0447C117.036 15.0447 117.901 14.6939 118.602 13.9924C119.304 13.2909 119.655 12.4101 119.655 11.3501C119.655 10.29 119.304 9.40922 118.602 8.70771C117.901 8.00619 117.036 7.65543 116.007 7.65543C114.978 7.65543 114.113 8.00619 113.411 8.70771C112.71 9.40922 112.359 10.29 112.359 11.3501C112.359 12.4101 112.71 13.2909 113.411 13.9924Z" fill="currentColor"></path></svg></span></a></div><div class="mb-1 flex basis-full flex-col gap-x-10 gap-y-2 min-[414px]:order-1 min-[414px]:mb-0 min-[414px]:gap-y-3 md:basis-auto md:items-start md:gap-y-2 min-[1070px]:order-none min-[1070px]:flex-row min-[1070px]:items-center xl:mb-8 xl:flex-col xl:items-start xl:gap-y-4"><p class="text-sm text-text-base-secondary">البحث والتحليل لقنوات تيليجرام في مكان واحد</p><button class="button button-border select-none focus-visible:bg-[inherit] focus-visible:outline-none button_primary button_small z-10 whitespace-nowrap font-medium">تسجيل الدخول</button><div class="mt-5 flex gap-2 sm:mt-8 md:mt-0 xl:mt-8"><a target="_blank" title="Telegram Link" href="https://l.tlmtr.cc/35vl63"><img alt="telegram logo" loading="lazy" width="24" height="24" decoding="async" data-nimg="1" style="color:transparent" src="https://cdn.tlmtr.io/_next/static/media/telegram.7780e3ac.svg"/></a><a title="Instagram Link" target="_blank" href="https://l.tlmtr.cc/GhvqNw"><img alt="instagram logo" loading="lazy" width="24" height="24" decoding="async" data-nimg="1" style="color:transparent" src="https://cdn.tlmtr.io/_next/static/media/instagram.d18ee2ec.svg"/></a><a title="LinkedIn Link" target="_blank" href="https://l.tlmtr.cc/yzXMf3"><img alt="linkedin logo" loading="lazy" width="24" height="24" decoding="async" data-nimg="1" style="color:transparent" src="https://cdn.tlmtr.io/_next/static/media/linkedin.f1cf6f56.svg"/></a><a title="X Link" target="_blank" href="https://l.tlmtr.cc/f3zV5B"><img alt="x logo" loading="lazy" width="24" height="24" decoding="async" data-nimg="1" style="color:transparent" src="https://cdn.tlmtr.io/_next/static/media/social_x.62c9076d.svg"/></a></div></div><div class="-mt-2 min-[414px]:basis-[52%] min-[1070px]:flex-1"></div></div><div class="grid grid-cols-1 gap-x-9 gap-y-7 min-[508px]:grid-cols-2 md:grid-cols-3 md:gap-y-9 lg:gap-x-11 min-[1070px]:flex min-[1070px]:justify-start xl:gap-x-9 min-[1680px]:gap-x-[68px]"><div class="flex flex-col gap-6"><div><span class="mb-4 block text-sm font-semibold text-text-base-primary">التقييمات</span><ul class="flex list-none flex-col gap-4"><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="">الكتالوج الأساسي</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/bots/global">روبوتات تيليجرام</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/countries">ترتيب البلد</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/categories">التقييمات حسب الفئة</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="">تصنيف شبكات القنوات</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/collections/public">المجموعات الموصى بها</a></li></ul></div></div><div class="flex flex-col gap-6"><div><span class="mb-4 block text-sm font-semibold text-text-base-primary">أدوات</span><ul class="flex list-none flex-col gap-4"><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/tracking/about">تتبع الأحداث</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/ads-posts/about">مشاركات الإعلانات</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="">تصنيفات المعلنين</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/posts-search/about">بحث المشاركات</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/tg-cleaner/deleting">TgCleaner</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/tg-ads/about">Telegram Ads</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_blank" href="https://chromewebstore.google.com/detail/tg-ads-assistant/mkeadhmjcphanpkfflgogkgpdbkogodp">TG Ads Assistant<span class="bg-bg-label-primary-10 mx-1 rounded bg-bg-label-primary-01 px-1.5 py-px text-xs font-medium capitalize text-text-base-quaternary">BETA</span></a></li></ul></div></div><div class="flex flex-col gap-6"><div><span class="mb-4 block text-sm font-semibold text-text-base-primary">لوحات المعلومات</span><ul class="flex list-none flex-col gap-4"><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="">قنوات تيليجرام</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="">البوتات وMini Apps</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="">Telegram Ads</a></li></ul></div></div><div class="flex flex-col gap-6"><div><span class="mb-4 block text-sm font-semibold text-text-base-primary">الموارد</span><ul class="flex list-none flex-col gap-4"><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_blank" href="https://telemetrio.gitbook.io/docs">تعليمات</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="https://t.me/+5YM9Haq7C71iZjFi">دعم الدردشة باللغة الإنجليزية</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="https://t.me/telemetrio_news">أخبار تيليمتريو</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="/ar/research-2025">دراسة 2025</a></li></ul></div></div><div class="flex flex-col gap-6"><div><span class="mb-4 block text-sm font-semibold text-text-base-primary">API</span><ul class="flex list-none flex-col gap-4"><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_blank" href="https://api.tlmtr.io/docs/intro/overview">توثيق API</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_blank" href="https://t.me/telemetrio_api_bot">بوت API</a></li></ul></div><div><span class="mb-4 block text-sm font-semibold text-text-base-primary">بوتاتنا</span><ul class="flex list-none flex-col gap-4"><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="https://t.me/telemetr_io_bot">روبوت تحليل الإحصائيات</a></li><li><a class="flex items-center font-medium text-text-link-base hover:text-text-link-base-hover" target="_self" href="https://t.me/TelemetrioAlertBot">روبوت تبليغات</a></li></ul></div></div></div><details class="group text-xs absolute bottom-2 left-0"><summary class="flex w-fit cursor-pointer list-none items-center gap-1 rounded-md border border-border-base-secondary px-2 py-1 text-text-base-secondary hover:text-text-base-primary [&::-webkit-details-marker]:hidden">عربسكا<i class="icon-chevron-down-line inline-flex leading-[0] transition-transform group-open:rotate-180"></i></summary><ul class="absolute bottom-full left-0 z-10 mb-1 max-h-60 w-max min-w-full overflow-auto rounded-md border border-border-base-secondary bg-bg-base-primary py-1 shadow-lg"><li><a class="block whitespace-nowrap px-3 py-1.5 hover:bg-bg-base-secondary hover:text-text-base-primary text-text-base-secondary" href="/en/channels/1917151177-easy_javascript_ru/posts?cursor=IJQF">English</a></li><li><a class="block whitespace-nowrap px-3 py-1.5 hover:bg-bg-base-secondary hover:text-text-base-primary text-text-base-secondary" href="/uk/channels/1917151177-easy_javascript_ru/posts?cursor=IJQF">Українська</a></li><li><a class="block whitespace-nowrap px-3 py-1.5 hover:bg-bg-base-secondary hover:text-text-base-primary text-text-base-secondary" href="/ru/channels/1917151177-easy_javascript_ru/posts?cursor=IJQF">Русский</a></li><li><a class="block whitespace-nowrap px-3 py-1.5 hover:bg-bg-base-secondary hover:text-text-base-primary text-text-base-tertiary" href="/ar/channels/1917151177-easy_javascript_ru/posts?cursor=IJQF">عربسكا</a></li><li><a class="block whitespace-nowrap px-3 py-1.5 hover:bg-bg-base-secondary hover:text-text-base-primary text-text-base-secondary" href="/es/channels/1917151177-easy_javascript_ru/posts?cursor=IJQF">Español</a></li><li><a class="block whitespace-nowrap px-3 py-1.5 hover:bg-bg-base-secondary hover:text-text-base-primary text-text-base-secondary" href="/fa/channels/1917151177-easy_javascript_ru/posts?cursor=IJQF">فارسی</a></li><li><a class="block whitespace-nowrap px-3 py-1.5 hover:bg-bg-base-secondary hover:text-text-base-primary text-text-base-secondary" href="/uz/channels/1917151177-easy_javascript_ru/posts?cursor=IJQF">Oʻzbekcha</a></li><li><a class="block whitespace-nowrap px-3 py-1.5 hover:bg-bg-base-secondary hover:text-text-base-primary text-text-base-secondary" href="/ch/channels/1917151177-easy_javascript_ru/posts?cursor=IJQF">中文</a></li></ul></details></div><div class="flex flex-col items-center justify-between pt-5 text-xs border-t gap-y-3 min-[1070px]:flex-row"><div class="flex items-center gap-1 text-text-base-tertiary order-1 min-[1070px]:order-none"><i class="icon-copywriting-line inline-flex leading-[0]"></i>2026<!-- --> <!-- -->Telemetr.io جميع الحقوق محفوظة</div><div class="flex flex-wrap items-center justify-center gap-3 sm:flex-row min-[1070px]:gap-6"><a href="/ar/dmca" class="text-sm font-medium text-text-base-secondary">DMCA</a><a href="/ar/terms-of-use" class="text-sm font-medium text-text-base-secondary">شروط الاستخدام</a><a href="/ar/privacy-policy" class="text-sm font-medium text-text-base-secondary">سياسة خصوصية Telemetrio</a></div></div></footer><noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PCM9CD4W" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><script>requestAnimationFrame(function(){$RT=performance.now()});</script><script src="https://cdn.tlmtr.io/_next/static/chunks/webpack-724a0e2026b76c5e.js" id="_R_" async=""></script><div hidden id="S:0"><div class="item w-full hidden md:block"><div class="bg-gray-gradient relative h-full overflow-hidden rounded-lg px-4 py-[18px] shadow-border-custom-sm"><img alt="ads-index-placeholder" loading="lazy" width="772" height="212" decoding="async" data-nimg="1" class="absolute bottom-0 left-0 w-full max-w-[400px]" style="color:transparent" srcSet="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fcdn.tlmtr.io%2F_next%2Fstatic%2Fmedia%2Fads-index-placeholder.be30e9b6.png&w=828&q=75 1x, https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fcdn.tlmtr.io%2F_next%2Fstatic%2Fmedia%2Fads-index-placeholder.be30e9b6.png&w=1920&q=75 2x" src="https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fcdn.tlmtr.io%2F_next%2Fstatic%2Fmedia%2Fads-index-placeholder.be30e9b6.png&w=1920&q=75"/><div class="relative flex h-full w-full flex-col items-start gap-y-3.5"><div class="flex items-center gap-1"><span class="inline-flex max-w-full items-center gap-1 truncate font-semibold text-md lg:text-md gap-x-1.5 flex-none"><div class="grid flex-initial"><span class="truncate">Ads index</span></div><button type="button" data-state="closed" class="inline-flex" aria-label="Popover Button" aria-expanded="false" aria-haspopup="dialog"><i class="icon-info-circle-line inline-flex leading-[0] text-neutral3 text-base"></i></button></span><span class="mx-1 rounded bg-bg-label-primary-10 px-1.5 py-px text-xs font-medium capitalize text-text-base-quaternary">beta</span></div><div class="flex w-full flex-auto items-center justify-center gap-5"><button class="button button-border select-none whitespace-nowrap focus-visible:bg-[inherit] focus-visible:outline-none button_primary button_medium z-10 mx-auto"><i class="icon-lock-solid inline-flex leading-[0] button__icon"></i>Get PRO</button></div></div></div></div></div><script>$RB=[];$RV=function(a){$RT=performance.now();for(var b=0;b<a.length;b+=2){var c=a[b],e=a[b+1];null!==e.parentNode&&e.parentNode.removeChild(e);var f=c.parentNode;if(f){var g=c.previousSibling,h=0;do{if(c&&8===c.nodeType){var d=c.data;if("/$"===d||"/&"===d)if(0===h)break;else h--;else"$"!==d&&"$?"!==d&&"$~"!==d&&"$!"!==d&&"&"!==d||h++}d=c.nextSibling;f.removeChild(c);c=d}while(c);for(;e.firstChild;)f.insertBefore(e.firstChild,c);g.data="$";g._reactRetry&&requestAnimationFrame(g._reactRetry)}}a.length=0}; $RC=function(a,b){if(b=document.getElementById(b))(a=document.getElementById(a))?(a.previousSibling.data="$~",$RB.push(a,b),2===$RB.length&&("number"!==typeof $RT?requestAnimationFrame($RV.bind(null,$RB)):(a=performance.now(),setTimeout($RV.bind(null,$RB),2300>a&&2E3<a?2300-a:$RT+300-a)))):b.parentNode.removeChild(b)};$RC("B:0","S:0")</script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[57121,[],\"\"]\n3:I[74581,[],\"\"]\n7:I[90484,[],\"OutletBoundary\"]\n9:I[17837,[],\"AsyncMetadataOutlet\"]\nb:I[90484,[],\"ViewportBoundary\"]\nd:I[90484,[],\"MetadataBoundary\"]\ne:\"$Sreact.suspense\"\n10:I[27123,[],\"\"]\n:HL[\"https://cdn.tlmtr.io/_next/static/media/21350d82a1f187e9-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"https://cdn.tlmtr.io/_next/static/media/e4af272ccee01ff0-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"https://cdn.tlmtr.io/_next/static/css/fdf840e3cece8d79.css\",\"style\"]\n:HL[\"https://cdn.tlmtr.io/_next/static/css/a55981e9afb98fbc.css\",\"style\"]\n:HL[\"https://cdn.tlmtr.io/_next/static/css/52e4b83915ba0fb8.css\",\"style\"]\n:HL[\"https://cdn.tlmtr.io/_next/static/css/4502c63f65b18be3.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"B_d6GaPNf_zWb-i2e8JT1\",\"p\":\"https://cdn.tlmtr.io\",\"c\":[\"\",\"ar\",\"channels\",\"1917151177-easy_javascript_ru\",\"posts?cursor=IJQF\"],\"i\":false,\"f\":[[[\"\",{\"children\":[[\"lng\",\"ar\",\"d\"],{\"children\":[\"(channel)\",{\"children\":[\"channels\",{\"children\":[[\"id\",\"1917151177-easy_javascript_ru\",\"d\"],{\"children\":[\"posts\",{\"children\":[\"__PAGE__?{\\\"cursor\\\":\\\"IJQF\\\"}\",{}]}]}]}]},\"$undefined\",\"$undefined\",true]}]}],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[[\"lng\",\"ar\",\"d\"],[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"(channel)\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"https://cdn.tlmtr.io/_next/static/css/fdf840e3cece8d79.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"https://cdn.tlmtr.io/_next/static/css/a55981e9afb98fbc.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"https://cdn.tlmtr.io/_next/static/css/52e4b83915ba0fb8.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],\"$L4\"]}],{\"children\":[\"channels\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[[\"id\",\"1917151177-easy_javascript_ru\",\"d\"],[\"$\",\"$1\",\"c\",{\"children\":[null,\"$L5\"]}],{\"children\":[\"posts\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$1\",\"c\",{\"children\":[\"$L6\",[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"https://cdn.tlmtr.io/_next/static/css/4502c63f65b18be3.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"$L7\",null,{\"children\":[\"$L8\",[\"$\",\"$L9\",null,{\"promise\":\"$@a\"}]]}]]}],{},null,false]},null,false]},null,false]},null,false]},null,false]},null,false]},null,false],[\"$\",\"$1\",\"h\",{\"children\":[null,[[\"$\",\"$Lb\",null,{\"children\":\"$Lc\"}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]],[\"$\",\"$Ld\",null,{\"children\":[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$e\",null,{\"fallback\":null,\"children\":\"$Lf\"}]}]}]]}],false]],\"m\":\"$undefined\",\"G\":[\"$10\",[]],\"s\":false,\"S\":false}\n"])</script><script>self.__next_f.push([1,"c:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n8:null\n"])</script><script>self.__next_f.push([1,"11:I[42593,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"\"]\n"])</script><script>self.__next_f.push([1,"12:I[61800,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"13:I[52920,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"Providers\"]\n"])</script><script>self.__next_f.push([1,"4:[\"$\",\"html\",null,{\"lang\":\"ar\",\"className\":\"__className_40980a\",\"data-gtag\":\"G-RQLZYC299K\",\"suppressHydrationWarning\":true,\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"link\",null,{\"rel\":\"preconnect dns-prefetch\",\"href\":\"https://img.tlmtr.io/\",\"crossOrigin\":\"\"}],[\"$\",\"meta\",null,{\"name\":\"google-adsense-account\",\"content\":\"ca-pub-3955148371180451\"}],[\"$\",\"script\",null,{\"id\":\"google-tag-manager\",\"async\":true,\"src\":\"https://www.googletagmanager.com/gtag/js?id=G-RQLZYC299K\"}],[\"$\",\"script\",null,{\"id\":\"gtm-init\",\"dangerouslySetInnerHTML\":{\"__html\":\"\\n window.dataLayer = window.dataLayer || [];\\n function gtag(){dataLayer.push(arguments);}\\n gtag('js', new Date());\\n gtag('config', 'G-RQLZYC299K');\\n \"}}],[[\"$\",\"script\",null,{\"data-cfasync\":\"false\",\"type\":\"text/javascript\",\"dangerouslySetInnerHTML\":{\"__html\":\"\\n googletag = window.googletag || { cmd: [] };\\n // This part of the code is necessary if you want to see ads on test pages\\n // that have a different domain than the approved one, like \\\"next-dev.telemetr.io\\\".\\n googletag.cmd.push(() =\u003e {\\n googletag.pubads().set(\\\"page_url\\\", \\\"telemetr.io\\\");\\n });\\n\\n // Configure automatic auctioning for specific units\\n window.snigelPubConf = {\\n \\\"adengine\\\": {\\n \\\"activeAdUnits\\\": [\\\"adhesive\\\"]\\n }\\n };\\n \"}}],[\"$\",\"$L11\",null,{\"data-cfasync\":\"false\",\"async\":true,\"src\":\"https://cdn.snigelweb.com/adengine/telemetr.io/loader.js\",\"type\":\"text/javascript\"}],[\"$\",\"$L11\",null,{\"src\":\"https://btloader.com/tag?o=5658536637890560\u0026upapi=true\",\"async\":true}]]]}],[\"$\",\"body\",null,{\"suppressHydrationWarning\":true,\"className\":\"flex min-h-screen flex-col justify-between\",\"children\":[[\"$\",\"$L12\",null,{\"forcedTheme\":\"light\",\"children\":[\"$\",\"$L13\",null,{\"lng\":\"ar\",\"auth\":false,\"plan\":\"$undefined\",\"permissions\":\"$undefined\",\"moderatorPermissions\":\"$undefined\",\"categories\":{\"count\":41,\"items\":[{\"id\":{\"categoryId\":\"1IKDv6$co\",\"slug\":\"news-and-media\"},\"name\":\"news \u0026 media\",\"membersCount\":\"1298309847\",\"channelsCount\":62274,\"blocked\":false,\"slug\":\"news-and-media\"},{\"id\":{\"categoryId\":\"1Y5Zq3WYB\",\"slug\":\"technology-and-applications\"},\"name\":\"technology \u0026 applications\",\"membersCount\":\"856900102\",\"channelsCount\":57758,\"blocked\":false,\"slug\":\"technology-and-applications\"},{\"id\":{\"categoryId\":\"2MoXrBvGQ\",\"slug\":\"facts\"},\"name\":\"facts\",\"membersCount\":\"71449306\",\"channelsCount\":7557,\"blocked\":false,\"slug\":\"facts\"},{\"id\":{\"categoryId\":\"5wq9Rv4UQ\",\"slug\":\"social-network\"},\"name\":\"social network\",\"membersCount\":\"87882983\",\"channelsCount\":12807,\"blocked\":false,\"slug\":\"social-network\"},{\"id\":{\"categoryId\":\"6TVkBZBWA\",\"slug\":\"nature-and-animals\"},\"name\":\"nature and animals\",\"membersCount\":\"73240061\",\"channelsCount\":18053,\"blocked\":false,\"slug\":\"nature-and-animals\"},{\"id\":{\"categoryId\":\"6rjzTbQIJ\",\"slug\":\"travel\"},\"name\":\"travel\",\"membersCount\":\"130264573\",\"channelsCount\":21598,\"blocked\":false,\"slug\":\"travel\"},{\"id\":{\"categoryId\":\"6ygb4JDbz\",\"slug\":\"music\"},\"name\":\"music\",\"membersCount\":\"402012047\",\"channelsCount\":66285,\"blocked\":false,\"slug\":\"music\"},{\"id\":{\"categoryId\":\"73wy3h7Ga\",\"slug\":\"business\"},\"name\":\"business\",\"membersCount\":\"357002412\",\"channelsCount\":57307,\"blocked\":false,\"slug\":\"business\"},{\"id\":{\"categoryId\":\"7JeRWunw9\",\"slug\":\"cryptocurrencies\"},\"name\":\"cryptocurrencies\",\"membersCount\":\"906348493\",\"channelsCount\":41484,\"blocked\":false,\"slug\":\"cryptocurrencies\"},{\"id\":{\"categoryId\":\"8k9uJJDqc\",\"slug\":\"games\"},\"name\":\"games\",\"membersCount\":\"571830326\",\"channelsCount\":75785,\"blocked\":false,\"slug\":\"games\"},{\"id\":{\"categoryId\":\"9bO2OWL7y\",\"slug\":\"picture\"},\"name\":\"picture\",\"membersCount\":\"54948921\",\"channelsCount\":9007,\"blocked\":false,\"slug\":\"picture\"},{\"id\":{\"categoryId\":\"A3kRuH61H\",\"slug\":\"art-and-design\"},\"name\":\"art \u0026 design\",\"membersCount\":\"185490170\",\"channelsCount\":55909,\"blocked\":false,\"slug\":\"art-and-design\"},{\"id\":{\"categoryId\":\"CJWBagYw7\",\"slug\":\"books\"},\"name\":\"books\",\"membersCount\":\"171225632\",\"channelsCount\":29474,\"blocked\":false,\"slug\":\"books\"},{\"id\":{\"categoryId\":\"F3fhmhPAw\",\"slug\":\"linguistics\"},\"name\":\"linguistics\",\"membersCount\":\"31367094\",\"channelsCount\":6730,\"blocked\":false,\"slug\":\"linguistics\"},{\"id\":{\"categoryId\":\"GGBK0Mbm$\",\"slug\":\"home-and-architecture\"},\"name\":\"home \u0026 architecture\",\"membersCount\":\"60001524\",\"channelsCount\":11512,\"blocked\":false,\"slug\":\"home-and-architecture\"},{\"id\":{\"categoryId\":\"GrV1hfO57\",\"slug\":\"bets-and-casino\"},\"name\":\"bets \u0026 casino\",\"membersCount\":\"1242797977\",\"channelsCount\":115427,\"blocked\":false,\"slug\":\"bets-and-casino\"},{\"id\":{\"categoryId\":\"HoTaQVEux\",\"slug\":\"motivation-and-quotes\"},\"name\":\"motivation and quotes\",\"membersCount\":\"153462672\",\"channelsCount\":23320,\"blocked\":false,\"slug\":\"motivation-and-quotes\"},{\"id\":{\"categoryId\":\"Hrq5MdJLi\",\"slug\":\"humor-and-entertainment\"},\"name\":\"humor \u0026 entertainment\",\"membersCount\":\"252004430\",\"channelsCount\":34441,\"blocked\":false,\"slug\":\"humor-and-entertainment\"},{\"id\":{\"categoryId\":\"MqpAf@IsD\",\"slug\":\"real-estate\"},\"name\":\"real estate\",\"membersCount\":\"74069110\",\"channelsCount\":18147,\"blocked\":false,\"slug\":\"real-estate\"},{\"id\":{\"categoryId\":\"OBfd25y9m\",\"slug\":\"religion-and-spirituality\"},\"name\":\"religion \u0026 spirituality\",\"membersCount\":\"451564500\",\"channelsCount\":116672,\"blocked\":false,\"slug\":\"religion-and-spirituality\"},{\"id\":{\"categoryId\":\"RGAfBUAl1\",\"slug\":\"telegram\"},\"name\":\"telegram\",\"membersCount\":\"90266975\",\"channelsCount\":2119,\"blocked\":false,\"slug\":\"telegram\"},{\"id\":{\"categoryId\":\"SMb7kkI4F\",\"slug\":\"transport\"},\"name\":\"transport\",\"membersCount\":\"141526511\",\"channelsCount\":25246,\"blocked\":false,\"slug\":\"transport\"},{\"id\":{\"categoryId\":\"V4xyI404d\",\"slug\":\"other\"},\"name\":\"other\",\"membersCount\":\"94850\",\"channelsCount\":28,\"blocked\":false,\"slug\":\"other\"},{\"id\":{\"categoryId\":\"WeTBPd0s1\",\"slug\":\"food-and-drink\"},\"name\":\"food \u0026 drink\",\"membersCount\":\"127499524\",\"channelsCount\":22848,\"blocked\":false,\"slug\":\"food-and-drink\"},{\"id\":{\"categoryId\":\"XBhA1tiMq\",\"slug\":\"sports\"},\"name\":\"sports\",\"membersCount\":\"357288974\",\"channelsCount\":36939,\"blocked\":false,\"slug\":\"sports\"},{\"id\":{\"categoryId\":\"XtJVweWxm\",\"slug\":\"blogs\"},\"name\":\"blogs\",\"membersCount\":\"257566473\",\"channelsCount\":111930,\"blocked\":false,\"slug\":\"blogs\"},{\"id\":{\"categoryId\":\"bjEbAZd4y\",\"slug\":\"sales\"},\"name\":\"sales\",\"membersCount\":\"363335926\",\"channelsCount\":47535,\"blocked\":false,\"slug\":\"sales\"},{\"id\":{\"categoryId\":\"dSaWDWWIX\",\"slug\":\"beauty\"},\"name\":\"beauty\",\"membersCount\":\"243417622\",\"channelsCount\":56023,\"blocked\":false,\"slug\":\"beauty\"},{\"id\":{\"categoryId\":\"gTxJVfQzs\",\"slug\":\"movies\"},\"name\":\"movies\",\"membersCount\":\"1221792456\",\"channelsCount\":88398,\"blocked\":false,\"slug\":\"movies\"},{\"id\":{\"categoryId\":\"he9Ly6T6O\",\"slug\":\"family-and-children\"},\"name\":\"family \u0026 children\",\"membersCount\":\"79028924\",\"channelsCount\":16404,\"blocked\":false,\"slug\":\"family-and-children\"},{\"id\":{\"categoryId\":\"kwuS97PYT\",\"slug\":\"education\"},\"name\":\"education\",\"membersCount\":\"983313991\",\"channelsCount\":111924,\"blocked\":false,\"slug\":\"education\"},{\"id\":{\"categoryId\":\"m6yGG2Ye@\",\"slug\":\"medicine\"},\"name\":\"medicine\",\"membersCount\":\"127885610\",\"channelsCount\":25263,\"blocked\":false,\"slug\":\"medicine\"},{\"id\":{\"categoryId\":\"mf2MkrwoE\",\"slug\":\"politics\"},\"name\":\"politics\",\"membersCount\":\"334531184\",\"channelsCount\":31062,\"blocked\":false,\"slug\":\"politics\"},{\"id\":{\"categoryId\":\"mxorZRxAA\",\"slug\":\"erotic\"},\"name\":\"erotic\",\"membersCount\":\"1589293990\",\"channelsCount\":144493,\"blocked\":false,\"slug\":\"erotic\"},{\"id\":{\"categoryId\":\"rW6jiogfG\",\"slug\":\"marketing-and-pr\"},\"name\":\"marketing \u0026 pr\",\"membersCount\":\"78992551\",\"channelsCount\":9411,\"blocked\":false,\"slug\":\"marketing-and-pr\"},{\"id\":{\"categoryId\":\"t3YiaQgvx\",\"slug\":\"psychology\"},\"name\":\"psychology\",\"membersCount\":\"106037323\",\"channelsCount\":31082,\"blocked\":false,\"slug\":\"psychology\"},{\"id\":{\"categoryId\":\"tyQki9nXm\",\"slug\":\"career\"},\"name\":\"career\",\"membersCount\":\"181547046\",\"channelsCount\":16255,\"blocked\":false,\"slug\":\"career\"},{\"id\":{\"categoryId\":\"wE1@n4moe\",\"slug\":\"prohibited-content\"},\"name\":\"prohibited content\",\"membersCount\":\"136005171\",\"channelsCount\":6616,\"blocked\":true,\"slug\":\"prohibited-content\"},{\"id\":{\"categoryId\":\"yqivk2Kx\",\"slug\":\"legal\"},\"name\":\"legal\",\"membersCount\":\"45262554\",\"channelsCount\":6784,\"blocked\":false,\"slug\":\"legal\"},{\"id\":{\"categoryId\":\"yurVgU76a\",\"slug\":\"economy-and-finance\"},\"name\":\"economy \u0026 finance\",\"membersCount\":\"652120922\",\"channelsCount\":62585,\"blocked\":false,\"slug\":\"economy-and-finance\"},{\"id\":{\"categoryId\":\"zBMeATYGE\",\"slug\":\"healthy-lifestyle\"},\"name\":\"healthy lifestyle\",\"membersCount\":\"114575453\",\"channelsCount\":24748,\"blocked\":false,\"slug\":\"healthy-lifestyle\"}]},\"countries\":{\"count\":104,\"items\":[{\"id\":{\"countryId\":\"india\"},\"name\":\"india\",\"channelsCount\":185166,\"membersCount\":\"1917851273\"},{\"id\":{\"countryId\":\"pakistan\"},\"name\":\"pakistan\",\"channelsCount\":12,\"membersCount\":\"116175\"},{\"id\":{\"countryId\":\"israel\"},\"name\":\"israel\",\"channelsCount\":3278,\"membersCount\":\"30331968\"},{\"id\":{\"countryId\":\"greece\"},\"name\":\"greece\",\"channelsCount\":341,\"membersCount\":\"1007188\"},{\"id\":{\"countryId\":\"france\"},\"name\":\"france\",\"channelsCount\":13899,\"membersCount\":\"149543059\"},{\"id\":{\"countryId\":\"korea\"},\"name\":\"korea\",\"channelsCount\":4515,\"membersCount\":\"24269391\"},{\"id\":{\"countryId\":\"saudi_arabia\"},\"name\":\"saudi_arabia\",\"channelsCount\":61086,\"membersCount\":\"362576104\"},{\"id\":{\"countryId\":\"russia\"},\"name\":\"russia\",\"channelsCount\":727094,\"membersCount\":\"4025298929\"},{\"id\":{\"countryId\":\"oman\"},\"name\":\"oman\",\"channelsCount\":2,\"membersCount\":\"19481\"},{\"id\":{\"countryId\":\"serbia\"},\"name\":\"serbia\",\"channelsCount\":634,\"membersCount\":\"2664405\"},{\"id\":{\"countryId\":\"somalia\"},\"name\":\"somalia\",\"channelsCount\":1270,\"membersCount\":\"38387295\"},{\"id\":{\"countryId\":\"syria\"},\"name\":\"syria\",\"channelsCount\":4898,\"membersCount\":\"48898365\"},{\"id\":{\"countryId\":\"ukraine\"},\"name\":\"ukraine\",\"channelsCount\":42570,\"membersCount\":\"360800500\"},{\"id\":{\"countryId\":\"estonia\"},\"name\":\"estonia\",\"channelsCount\":5,\"membersCount\":\"31338\"},{\"id\":{\"countryId\":\"romania\"},\"name\":\"romania\",\"channelsCount\":696,\"membersCount\":\"3403650\"},{\"id\":{\"countryId\":\"lebanon\"},\"name\":\"lebanon\",\"channelsCount\":3,\"membersCount\":\"4441\"},{\"id\":{\"countryId\":\"armenia\"},\"name\":\"armenia\",\"channelsCount\":2882,\"membersCount\":\"10917806\"},{\"id\":{\"countryId\":\"croatia\"},\"name\":\"croatia\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"countryId\":\"brazil\"},\"name\":\"brazil\",\"channelsCount\":21181,\"membersCount\":\"211745854\"},{\"id\":{\"countryId\":\"bahrain\"},\"name\":\"bahrain\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"countryId\":\"taiwan\"},\"name\":\"taiwan\",\"channelsCount\":8,\"membersCount\":\"132330\"},{\"id\":{\"countryId\":\"belarus\"},\"name\":\"belarus\",\"channelsCount\":4307,\"membersCount\":\"16803554\"},{\"id\":{\"countryId\":\"indonesia\"},\"name\":\"indonesia\",\"channelsCount\":39320,\"membersCount\":\"296208738\"},{\"id\":{\"countryId\":\"moldova\"},\"name\":\"moldova\",\"channelsCount\":893,\"membersCount\":\"3961487\"},{\"id\":{\"countryId\":\"turkmenistan\"},\"name\":\"turkmenistan\",\"channelsCount\":2,\"membersCount\":\"4966\"},{\"id\":{\"countryId\":\"portugal\"},\"name\":\"portugal\",\"channelsCount\":1251,\"membersCount\":\"7737095\"},{\"id\":{\"countryId\":\"jordan\"},\"name\":\"jordan\",\"channelsCount\":4,\"membersCount\":\"14444\"},{\"id\":{\"countryId\":\"norway\"},\"name\":\"norway\",\"channelsCount\":2,\"membersCount\":\"1899\"},{\"id\":{\"countryId\":\"libya\"},\"name\":\"libya\",\"channelsCount\":6,\"membersCount\":\"87018\"},{\"id\":{\"countryId\":\"malaysia\"},\"name\":\"malaysia\",\"channelsCount\":19033,\"membersCount\":\"174361733\"},{\"id\":{\"countryId\":\"palestine\"},\"name\":\"palestine\",\"channelsCount\":3,\"membersCount\":\"17577\"},{\"id\":{\"countryId\":\"bulgaria\"},\"name\":\"bulgaria\",\"channelsCount\":26,\"membersCount\":\"135861\"},{\"id\":{\"countryId\":\"uae\"},\"name\":\"uae\",\"channelsCount\":2435,\"membersCount\":\"16295420\"},{\"id\":{\"countryId\":\"yemen\"},\"name\":\"yemen\",\"channelsCount\":8,\"membersCount\":\"98303\"},{\"id\":{\"countryId\":\"tunisia\"},\"name\":\"tunisia\",\"channelsCount\":1,\"membersCount\":\"7353\"},{\"id\":{\"countryId\":\"united_kingdom\"},\"name\":\"united_kingdom\",\"channelsCount\":7320,\"membersCount\":\"59472718\"},{\"id\":{\"countryId\":\"uzbekistan\"},\"name\":\"uzbekistan\",\"channelsCount\":71382,\"membersCount\":\"436681397\"},{\"id\":{\"countryId\":\"kenya\"},\"name\":\"kenya\",\"channelsCount\":9,\"membersCount\":\"163976\"},{\"id\":{\"countryId\":\"sudan\"},\"name\":\"sudan\",\"channelsCount\":2,\"membersCount\":\"17319\"},{\"id\":{\"countryId\":\"nigeria\"},\"name\":\"nigeria\",\"channelsCount\":5855,\"membersCount\":\"86941104\"},{\"id\":{\"countryId\":\"bosnia_and_herzegovina\"},\"name\":\"bosnia_and_herzegovina\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"countryId\":\"canada\"},\"name\":\"canada\",\"channelsCount\":33,\"membersCount\":\"228262\"},{\"id\":{\"countryId\":\"iraq\"},\"name\":\"iraq\",\"channelsCount\":98610,\"membersCount\":\"687587637\"},{\"id\":{\"countryId\":\"finland\"},\"name\":\"finland\",\"channelsCount\":1605,\"membersCount\":\"19591437\"},{\"id\":{\"countryId\":\"azerbaijan\"},\"name\":\"azerbaijan\",\"channelsCount\":3025,\"membersCount\":\"16903146\"},{\"id\":{\"countryId\":\"slovakia\"},\"name\":\"slovakia\",\"channelsCount\":105,\"membersCount\":\"676103\"},{\"id\":{\"countryId\":\"kazakhstan\"},\"name\":\"kazakhstan\",\"channelsCount\":6313,\"membersCount\":\"37911585\"},{\"id\":{\"countryId\":\"mongolia\"},\"name\":\"mongolia\",\"channelsCount\":3,\"membersCount\":\"17182\"},{\"id\":{\"countryId\":\"algeria\"},\"name\":\"algeria\",\"channelsCount\":4,\"membersCount\":\"75496\"},{\"id\":{\"countryId\":\"japan\"},\"name\":\"japan\",\"channelsCount\":3479,\"membersCount\":\"26011938\"},{\"id\":{\"countryId\":\"qatar\"},\"name\":\"qatar\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"countryId\":\"czech_republic\"},\"name\":\"czech_republic\",\"channelsCount\":725,\"membersCount\":\"2843586\"},{\"id\":{\"countryId\":\"georgia\"},\"name\":\"georgia\",\"channelsCount\":996,\"membersCount\":\"4368768\"},{\"id\":{\"countryId\":\"kyrgyzstan\"},\"name\":\"kyrgyzstan\",\"channelsCount\":1957,\"membersCount\":\"8310790\"},{\"id\":{\"countryId\":\"morocco\"},\"name\":\"morocco\",\"channelsCount\":8,\"membersCount\":\"274530\"},{\"id\":{\"countryId\":\"iran\"},\"name\":\"iran\",\"channelsCount\":169719,\"membersCount\":\"2008226295\"},{\"id\":{\"countryId\":\"ethiopia\"},\"name\":\"ethiopia\",\"channelsCount\":18755,\"membersCount\":\"173430030\"},{\"id\":{\"countryId\":\"germany\"},\"name\":\"germany\",\"channelsCount\":8120,\"membersCount\":\"57361429\"},{\"id\":{\"countryId\":\"china\"},\"name\":\"china\",\"channelsCount\":117069,\"membersCount\":\"1042043578\"},{\"id\":{\"countryId\":\"tajikistan\"},\"name\":\"tajikistan\",\"channelsCount\":2432,\"membersCount\":\"9931015\"},{\"id\":{\"countryId\":\"afghanistan\"},\"name\":\"afghanistan\",\"channelsCount\":9,\"membersCount\":\"67033\"},{\"id\":{\"countryId\":\"egypt\"},\"name\":\"egypt\",\"channelsCount\":15891,\"membersCount\":\"114922138\"},{\"id\":{\"countryId\":\"sweden\"},\"name\":\"sweden\",\"channelsCount\":9,\"membersCount\":\"15026\"},{\"id\":{\"countryId\":\"turkey\"},\"name\":\"turkey\",\"channelsCount\":15692,\"membersCount\":\"158974521\"},{\"id\":{\"countryId\":\"singapore\"},\"name\":\"singapore\",\"channelsCount\":2756,\"membersCount\":\"18016764\"},{\"id\":{\"countryId\":\"australia\"},\"name\":\"australia\",\"channelsCount\":6,\"membersCount\":\"42241\"},{\"id\":{\"countryId\":\"slovenia\"},\"name\":\"slovenia\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"countryId\":\"poland\"},\"name\":\"poland\",\"channelsCount\":2330,\"membersCount\":\"9910726\"},{\"id\":{\"countryId\":\"netherlands\"},\"name\":\"netherlands\",\"channelsCount\":680,\"membersCount\":\"2730853\"},{\"id\":{\"countryId\":\"vietnam\"},\"name\":\"vietnam\",\"channelsCount\":6949,\"membersCount\":\"86547993\"},{\"id\":{\"countryId\":\"italy\"},\"name\":\"italy\",\"channelsCount\":14016,\"membersCount\":\"118958346\"},{\"id\":{\"countryId\":\"spain\"},\"name\":\"spain\",\"channelsCount\":27740,\"membersCount\":\"390288606\"},{\"id\":{\"countryId\":\"thailand\"},\"name\":\"thailand\",\"channelsCount\":2804,\"membersCount\":\"39389937\"},{\"id\":{\"countryId\":\"sri_lanka\"},\"name\":\"sri_lanka\",\"channelsCount\":1955,\"membersCount\":\"10104173\"},{\"id\":{\"countryId\":\"austria\"},\"name\":\"austria\",\"channelsCount\":67,\"membersCount\":\"357689\"},{\"id\":{\"countryId\":\"cambodia\"},\"name\":\"cambodia\",\"channelsCount\":7384,\"membersCount\":\"27986812\"},{\"id\":{\"countryId\":\"usa\"},\"name\":\"usa\",\"channelsCount\":21634,\"membersCount\":\"204127491\"},{\"id\":{\"countryId\":\"bangladesh\"},\"name\":\"bangladesh\",\"channelsCount\":19535,\"membersCount\":\"106148666\"},{\"id\":{\"countryId\":\"myanmar\"},\"name\":\"myanmar\",\"channelsCount\":37595,\"membersCount\":\"571030920\"},{\"id\":{\"countryId\":\"latvia\"},\"name\":\"latvia\",\"channelsCount\":211,\"membersCount\":\"514238\"},{\"id\":{\"countryId\":\"lithuania\"},\"name\":\"lithuania\",\"channelsCount\":172,\"membersCount\":\"401745\"},{\"id\":{\"countryId\":\"colombia\"},\"name\":\"colombia\",\"channelsCount\":1458,\"membersCount\":\"20059211\"},{\"id\":{\"countryId\":\"chile\"},\"name\":\"chile\",\"channelsCount\":262,\"membersCount\":\"1578275\"},{\"id\":{\"countryId\":\"philippines\"},\"name\":\"philippines\",\"channelsCount\":3547,\"membersCount\":\"31298850\"},{\"id\":{\"countryId\":\"international\"},\"name\":\"international\",\"channelsCount\":2884,\"membersCount\":\"493258330\"},{\"id\":{\"countryId\":\"argentina\"},\"name\":\"argentina\",\"channelsCount\":1601,\"membersCount\":\"14614178\"},{\"id\":{\"countryId\":\"cameroon\"},\"name\":\"cameroon\",\"channelsCount\":394,\"membersCount\":\"6035901\"},{\"id\":{\"countryId\":\"ivory_coast\"},\"name\":\"ivory_coast\",\"channelsCount\":126,\"membersCount\":\"1742488\"},{\"id\":{\"countryId\":\"mexico\"},\"name\":\"mexico\",\"channelsCount\":3298,\"membersCount\":\"38220690\"},{\"id\":{\"countryId\":\"senegal\"},\"name\":\"senegal\",\"channelsCount\":155,\"membersCount\":\"2414039\"},{\"id\":{\"countryId\":\"venezuela\"},\"name\":\"venezuela\",\"channelsCount\":1779,\"membersCount\":\"22084847\"},{\"id\":{\"countryId\":\"peru\"},\"name\":\"peru\",\"channelsCount\":1550,\"membersCount\":\"14725534\"},{\"id\":{\"countryId\":\"uruguay\"},\"name\":\"uruguay\",\"channelsCount\":23,\"membersCount\":\"71675\"},{\"id\":{\"countryId\":\"paraguay\"},\"name\":\"paraguay\",\"channelsCount\":40,\"membersCount\":\"199414\"},{\"id\":{\"countryId\":\"ecuador\"},\"name\":\"ecuador\",\"channelsCount\":829,\"membersCount\":\"10654343\"},{\"id\":{\"countryId\":\"haiti\"},\"name\":\"haiti\",\"channelsCount\":10,\"membersCount\":\"320483\"},{\"id\":{\"countryId\":\"panama\"},\"name\":\"panama\",\"channelsCount\":11,\"membersCount\":\"125825\"},{\"id\":{\"countryId\":\"costa_rica\"},\"name\":\"costa_rica\",\"channelsCount\":39,\"membersCount\":\"256146\"},{\"id\":{\"countryId\":\"salvador\"},\"name\":\"salvador\",\"channelsCount\":14,\"membersCount\":\"255020\"},{\"id\":{\"countryId\":\"guatemala\"},\"name\":\"guatemala\",\"channelsCount\":48,\"membersCount\":\"330460\"},{\"id\":{\"countryId\":\"bolivia\"},\"name\":\"bolivia\",\"channelsCount\":44,\"membersCount\":\"523571\"},{\"id\":{\"countryId\":\"dominican_republic\"},\"name\":\"dominican_republic\",\"channelsCount\":87,\"membersCount\":\"2138074\"},{\"id\":{\"countryId\":\"puerto_rico\"},\"name\":\"puerto_rico\",\"channelsCount\":17,\"membersCount\":\"151934\"},{\"id\":{\"countryId\":\"honduras\"},\"name\":\"honduras\",\"channelsCount\":0,\"membersCount\":\"0\"}]},\"languages\":{\"count\":114,\"items\":[{\"id\":{\"languageId\":\"af\"},\"name\":\"af\",\"channelsCount\":34,\"membersCount\":\"87142\"},{\"id\":{\"languageId\":\"ak\"},\"name\":\"ak\",\"channelsCount\":2,\"membersCount\":\"38\"},{\"id\":{\"languageId\":\"am\"},\"name\":\"am\",\"channelsCount\":13143,\"membersCount\":\"136193232\"},{\"id\":{\"languageId\":\"an\"},\"name\":\"an\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"ar\"},\"name\":\"ar\",\"channelsCount\":185550,\"membersCount\":\"1231705786\"},{\"id\":{\"languageId\":\"arz\"},\"name\":\"arz\",\"channelsCount\":5,\"membersCount\":\"2750\"},{\"id\":{\"languageId\":\"az\"},\"name\":\"az\",\"channelsCount\":2497,\"membersCount\":\"14959791\"},{\"id\":{\"languageId\":\"ba\"},\"name\":\"ba\",\"channelsCount\":41,\"membersCount\":\"80360\"},{\"id\":{\"languageId\":\"be\"},\"name\":\"be\",\"channelsCount\":269,\"membersCount\":\"1005846\"},{\"id\":{\"languageId\":\"bg\"},\"name\":\"bg\",\"channelsCount\":307,\"membersCount\":\"766937\"},{\"id\":{\"languageId\":\"bm\"},\"name\":\"bm\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"bn\"},\"name\":\"bn\",\"channelsCount\":15424,\"membersCount\":\"84829206\"},{\"id\":{\"languageId\":\"bo\"},\"name\":\"bo\",\"channelsCount\":9,\"membersCount\":\"12705\"},{\"id\":{\"languageId\":\"bs\"},\"name\":\"bs\",\"channelsCount\":234,\"membersCount\":\"648958\"},{\"id\":{\"languageId\":\"ca\"},\"name\":\"ca\",\"channelsCount\":331,\"membersCount\":\"910715\"},{\"id\":{\"languageId\":\"ce\"},\"name\":\"ce\",\"channelsCount\":93,\"membersCount\":\"190685\"},{\"id\":{\"languageId\":\"cs\"},\"name\":\"cs\",\"channelsCount\":310,\"membersCount\":\"1079571\"},{\"id\":{\"languageId\":\"cy\"},\"name\":\"cy\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"da\"},\"name\":\"da\",\"channelsCount\":19,\"membersCount\":\"25974\"},{\"id\":{\"languageId\":\"de\"},\"name\":\"de\",\"channelsCount\":7337,\"membersCount\":\"53256177\"},{\"id\":{\"languageId\":\"ee\"},\"name\":\"ee\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"el\"},\"name\":\"el\",\"channelsCount\":311,\"membersCount\":\"976600\"},{\"id\":{\"languageId\":\"en\"},\"name\":\"en\",\"channelsCount\":230248,\"membersCount\":\"2849996938\"},{\"id\":{\"languageId\":\"eo\"},\"name\":\"eo\",\"channelsCount\":137,\"membersCount\":\"594784\"},{\"id\":{\"languageId\":\"es\"},\"name\":\"es\",\"channelsCount\":37568,\"membersCount\":\"477463252\"},{\"id\":{\"languageId\":\"et\"},\"name\":\"et\",\"channelsCount\":110,\"membersCount\":\"760905\"},{\"id\":{\"languageId\":\"eu\"},\"name\":\"eu\",\"channelsCount\":38,\"membersCount\":\"84882\"},{\"id\":{\"languageId\":\"fa\"},\"name\":\"fa\",\"channelsCount\":154275,\"membersCount\":\"1919488162\"},{\"id\":{\"languageId\":\"fi\"},\"name\":\"fi\",\"channelsCount\":66,\"membersCount\":\"128732\"},{\"id\":{\"languageId\":\"fo\"},\"name\":\"fo\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"fr\"},\"name\":\"fr\",\"channelsCount\":14212,\"membersCount\":\"153436375\"},{\"id\":{\"languageId\":\"gl\"},\"name\":\"gl\",\"channelsCount\":36,\"membersCount\":\"118061\"},{\"id\":{\"languageId\":\"gu\"},\"name\":\"gu\",\"channelsCount\":900,\"membersCount\":\"7774982\"},{\"id\":{\"languageId\":\"ha\"},\"name\":\"ha\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"he\"},\"name\":\"he\",\"channelsCount\":2155,\"membersCount\":\"22741542\"},{\"id\":{\"languageId\":\"hi\"},\"name\":\"hi\",\"channelsCount\":15091,\"membersCount\":\"210295119\"},{\"id\":{\"languageId\":\"hr\"},\"name\":\"hr\",\"channelsCount\":17,\"membersCount\":\"58580\"},{\"id\":{\"languageId\":\"ht\"},\"name\":\"ht\",\"channelsCount\":1,\"membersCount\":\"3140\"},{\"id\":{\"languageId\":\"hu\"},\"name\":\"hu\",\"channelsCount\":184,\"membersCount\":\"699909\"},{\"id\":{\"languageId\":\"hy\"},\"name\":\"hy\",\"channelsCount\":1188,\"membersCount\":\"4975113\"},{\"id\":{\"languageId\":\"id\"},\"name\":\"id\",\"channelsCount\":14885,\"membersCount\":\"122833365\"},{\"id\":{\"languageId\":\"ig\"},\"name\":\"ig\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"it\"},\"name\":\"it\",\"channelsCount\":12689,\"membersCount\":\"109060793\"},{\"id\":{\"languageId\":\"ja\"},\"name\":\"ja\",\"channelsCount\":562,\"membersCount\":\"5752562\"},{\"id\":{\"languageId\":\"jv\"},\"name\":\"jv\",\"channelsCount\":2225,\"membersCount\":\"20309734\"},{\"id\":{\"languageId\":\"ka\"},\"name\":\"ka\",\"channelsCount\":120,\"membersCount\":\"389921\"},{\"id\":{\"languageId\":\"kk\"},\"name\":\"kk\",\"channelsCount\":2526,\"membersCount\":\"18940116\"},{\"id\":{\"languageId\":\"km\"},\"name\":\"km\",\"channelsCount\":5639,\"membersCount\":\"23281365\"},{\"id\":{\"languageId\":\"kn\"},\"name\":\"kn\",\"channelsCount\":2646,\"membersCount\":\"12522491\"},{\"id\":{\"languageId\":\"ko\"},\"name\":\"ko\",\"channelsCount\":3091,\"membersCount\":\"13609999\"},{\"id\":{\"languageId\":\"ku\"},\"name\":\"ku\",\"channelsCount\":53,\"membersCount\":\"161973\"},{\"id\":{\"languageId\":\"ky\"},\"name\":\"ky\",\"channelsCount\":416,\"membersCount\":\"1965657\"},{\"id\":{\"languageId\":\"la\"},\"name\":\"la\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"lg\"},\"name\":\"lg\",\"channelsCount\":1,\"membersCount\":\"5827\"},{\"id\":{\"languageId\":\"ln\"},\"name\":\"ln\",\"channelsCount\":1,\"membersCount\":\"3014\"},{\"id\":{\"languageId\":\"mk\"},\"name\":\"mk\",\"channelsCount\":20,\"membersCount\":\"41602\"},{\"id\":{\"languageId\":\"ml\"},\"name\":\"ml\",\"channelsCount\":1913,\"membersCount\":\"31019277\"},{\"id\":{\"languageId\":\"mn\"},\"name\":\"mn\",\"channelsCount\":126,\"membersCount\":\"1009084\"},{\"id\":{\"languageId\":\"mr\"},\"name\":\"mr\",\"channelsCount\":1902,\"membersCount\":\"29293081\"},{\"id\":{\"languageId\":\"ms\"},\"name\":\"ms\",\"channelsCount\":4276,\"membersCount\":\"32243821\"},{\"id\":{\"languageId\":\"mt\"},\"name\":\"mt\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"my\"},\"name\":\"my\",\"channelsCount\":34337,\"membersCount\":\"545934254\"},{\"id\":{\"languageId\":\"ne\"},\"name\":\"ne\",\"channelsCount\":57,\"membersCount\":\"328579\"},{\"id\":{\"languageId\":\"ng\"},\"name\":\"ng\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"nl\"},\"name\":\"nl\",\"channelsCount\":439,\"membersCount\":\"1716611\"},{\"id\":{\"languageId\":\"nn\"},\"name\":\"nn\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"no\"},\"name\":\"no\",\"channelsCount\":319,\"membersCount\":\"2644258\"},{\"id\":{\"languageId\":\"ny\"},\"name\":\"ny\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"pa\"},\"name\":\"pa\",\"channelsCount\":292,\"membersCount\":\"1033701\"},{\"id\":{\"languageId\":\"pl\"},\"name\":\"pl\",\"channelsCount\":1589,\"membersCount\":\"6586587\"},{\"id\":{\"languageId\":\"ps\"},\"name\":\"ps\",\"channelsCount\":1695,\"membersCount\":\"4911638\"},{\"id\":{\"languageId\":\"pt\"},\"name\":\"pt\",\"channelsCount\":20863,\"membersCount\":\"209786185\"},{\"id\":{\"languageId\":\"qu\"},\"name\":\"qu\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"rn\"},\"name\":\"rn\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"ro\"},\"name\":\"ro\",\"channelsCount\":827,\"membersCount\":\"3527700\"},{\"id\":{\"languageId\":\"ru\"},\"name\":\"ru\",\"channelsCount\":667241,\"membersCount\":\"3804729359\"},{\"id\":{\"languageId\":\"rw\"},\"name\":\"rw\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"sa\"},\"name\":\"sa\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"sd\"},\"name\":\"sd\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"se\"},\"name\":\"se\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"sg\"},\"name\":\"sg\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"si\"},\"name\":\"si\",\"channelsCount\":1491,\"membersCount\":\"7896611\"},{\"id\":{\"languageId\":\"sk\"},\"name\":\"sk\",\"channelsCount\":286,\"membersCount\":\"1191425\"},{\"id\":{\"languageId\":\"sl\"},\"name\":\"sl\",\"channelsCount\":20,\"membersCount\":\"21240\"},{\"id\":{\"languageId\":\"sn\"},\"name\":\"sn\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"so\"},\"name\":\"so\",\"channelsCount\":1423,\"membersCount\":\"44307763\"},{\"id\":{\"languageId\":\"sr\"},\"name\":\"sr\",\"channelsCount\":170,\"membersCount\":\"1108135\"},{\"id\":{\"languageId\":\"ss\"},\"name\":\"ss\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"st\"},\"name\":\"st\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"su\"},\"name\":\"su\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"sv\"},\"name\":\"sv\",\"channelsCount\":49,\"membersCount\":\"69796\"},{\"id\":{\"languageId\":\"sw\"},\"name\":\"sw\",\"channelsCount\":1,\"membersCount\":\"1508\"},{\"id\":{\"languageId\":\"ta\"},\"name\":\"ta\",\"channelsCount\":894,\"membersCount\":\"6771145\"},{\"id\":{\"languageId\":\"te\"},\"name\":\"te\",\"channelsCount\":353,\"membersCount\":\"3155124\"},{\"id\":{\"languageId\":\"tg\"},\"name\":\"tg\",\"channelsCount\":523,\"membersCount\":\"2653084\"},{\"id\":{\"languageId\":\"th\"},\"name\":\"th\",\"channelsCount\":2575,\"membersCount\":\"37553937\"},{\"id\":{\"languageId\":\"ti\"},\"name\":\"ti\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"tk\"},\"name\":\"tk\",\"channelsCount\":355,\"membersCount\":\"2639613\"},{\"id\":{\"languageId\":\"tl\"},\"name\":\"tl\",\"channelsCount\":707,\"membersCount\":\"6732383\"},{\"id\":{\"languageId\":\"tn\"},\"name\":\"tn\",\"channelsCount\":1,\"membersCount\":\"62\"},{\"id\":{\"languageId\":\"tr\"},\"name\":\"tr\",\"channelsCount\":11268,\"membersCount\":\"115511251\"},{\"id\":{\"languageId\":\"ts\"},\"name\":\"ts\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"tt\"},\"name\":\"tt\",\"channelsCount\":276,\"membersCount\":\"1344329\"},{\"id\":{\"languageId\":\"ug\"},\"name\":\"ug\",\"channelsCount\":89,\"membersCount\":\"82501\"},{\"id\":{\"languageId\":\"uk\"},\"name\":\"uk\",\"channelsCount\":38990,\"membersCount\":\"323958988\"},{\"id\":{\"languageId\":\"ur\"},\"name\":\"ur\",\"channelsCount\":384,\"membersCount\":\"3937611\"},{\"id\":{\"languageId\":\"uz\"},\"name\":\"uz\",\"channelsCount\":57552,\"membersCount\":\"385757659\"},{\"id\":{\"languageId\":\"ve\"},\"name\":\"ve\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"vi\"},\"name\":\"vi\",\"channelsCount\":6334,\"membersCount\":\"82722633\"},{\"id\":{\"languageId\":\"wo\"},\"name\":\"wo\",\"channelsCount\":5,\"membersCount\":\"33721\"},{\"id\":{\"languageId\":\"xh\"},\"name\":\"xh\",\"channelsCount\":0,\"membersCount\":\"0\"},{\"id\":{\"languageId\":\"yi\"},\"name\":\"yi\",\"channelsCount\":41,\"membersCount\":\"96118\"},{\"id\":{\"languageId\":\"zh\"},\"name\":\"zh\",\"channelsCount\":115461,\"membersCount\":\"1029677646\"},{\"id\":{\"languageId\":\"zu\"},\"name\":\"zu\",\"channelsCount\":0,\"membersCount\":\"0\"}]},\"features\":{\"showDiscountBanner\":false,\"openChannelInNewTab\":true,\"showImages\":false,\"showAdsIndex\":false,\"ambassadorAds\":\"amb_banner_netpeak\",\"researchBanner\":\"$undefined\",\"researchResults\":false,\"telegramBanners\":\"tg_banner_expert_knowledge\",\"regularDiscount\":null,\"refButton\":{},\"refPage\":true,\"showNewExport\":false,\"newYearCard\":false,\"dashboards\":true,\"darkTheme\":false,\"adPagePopup\":false,\"socialNetsPopup\":{},\"clarity\":false,\"reserveApiLink\":true},\"fingerprint\":\"$undefined\",\"ipCountry\":\"US\",\"children\":[\"$L14\",\"$L15\",\"$L16\",\"$L17\",\"$L18\",\"$L19\",\"$L1a\",\"$L1b\",\"$L1c\",\"$L1d\",\"$L1e\",\"$L1f\",\"$L20\",\"$L21\",\"$L22\"]}]}],\"$L23\",\"$L24\"]}]]}]\n"])</script><script>self.__next_f.push([1,"25:I[78126,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"26:I[15463,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"DefaultPlanTokenCheck\"]\n"])</script><script>self.__next_f.push([1,"27:I[8587,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"28:I[66903,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"29:I[72728,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"2a:I[48974,[\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"29234\",\"static/chunks/app/%5Blng%5D/(channel)/not-found-7dc23ad4de8c3ce2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"2b:I[52186,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"2c:I[66408,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"GlobalDialogs\"]\n"])</script><script>self.__next_f.push([1,"2d:I[80126,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"PromotionPopupWrapper\"]\n"])</script><script>self.__next_f.push([1,"2e:I[77046,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"SupportPopupWrapper\"]\n"])</script><script>self.__next_f.push([1,"2f:I[96355,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"30:I[43766,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"AuthorizationModalWrapper\"]\n"])</script><script>self.__next_f.push([1,"31:I[82151,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"NavigateToPlanModuleWrapper\"]\n"])</script><script>self.__next_f.push([1,"32:I[25958,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"PlanComparisonDialog\"]\n"])</script><script>self.__next_f.push([1,"33:I[68114,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"LimitReachedTeamDialog\"]\n"])</script><script>self.__next_f.push([1,"34:I[61020,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"31005\",\"static/chunks/31005-b9a24485ada7e789.js\",\"4760\",\"static/chunks/4760-958a8982cedb650f.js\",\"26720\",\"static/chunks/26720-ce256f63b21a99f4.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"56697\",\"static/chunks/56697-83525aafecc5f3fc.js\",\"83317\",\"static/chunks/83317-cf290db6fa6d3c04.js\",\"48796\",\"static/chunks/48796-21145456aafc1af2.js\",\"560\",\"static/chunks/app/%5Blng%5D/(channel)/layout-132ad8165bcf2ea2.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"14:[\"$\",\"$L25\",null,{}]\n15:[\"$\",\"$L26\",null,{}]\n16:[\"$\",\"$L27\",null,{}]\n17:[\"$\",\"$L28\",null,{}]\n18:[\"$\",\"$L29\",null,{\"features\":{},\"showThemeToggle\":false}]\n19:[\"$\",\"main\",null,{\"className\":\"flex flex-1 flex-col items-start py-8\",\"children\":[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"$L2a\",null,{}],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]\n1a:[\"$\",\"$L2b\",null,{\"features\":{}}]\n1b:[\"$\",\"$L2c\",null,{}]\n1c:[\"$\",\"$L2d\",null,{}]\n1d:[\"$\",\"$L2e\",null,{}]\n1e:[\"$\",\"$L2f\",null,{}]\n1f:[\"$\",\"$L30\",null,{}]\n20:[\"$\",\"$L31\",null,{}]\n21:[\"$\",\"$L32\",null,{}]\n22:[\"$\",\"$L33\",null,{}]\n23:[\"$\",\"$L34\",null,{\"gtmId\":\"GTM-PCM9CD4W\"}]\n35:T5a7,"])</script><script>self.__next_f.push([1,"\n // Function to manually start auctions\n function startAuction(selectors) {\n console.log(\"## Adngin is loaded and ready. ##\");\n adngin.queue.push(() =\u003e {\n adngin.cmd.startAuction(selectors);\n });\n }\n\n // Observe DOM for specific elements\n function observeMultipleElements(selectors, callback) {\n const observer = new MutationObserver((mutations) =\u003e {\n const allElementsFound = selectors.every(selector =\u003e document.querySelector('#' + selector.placement));\n if (allElementsFound) {\n console.log('All placements found.');\n if (window.adngin \u0026\u0026 window.adngin.adnginLoaderReady) {\n startAuction(elementsToCheck);\n } else {\n window.addEventListener('adnginLoaderReady', () =\u003e startAuction(elementsToCheck));\n }\n observer.disconnect();\n }\n });\n\n observer.observe(document.documentElement, { childList: true, subtree: true });\n }\n\n // Define elements to observe\n const elementsToCheck = [\n { adUnit: 'top', placement: 'adngin-top-0' }\n ];\n\n observeMultipleElements(elementsToCheck);\n "])</script><script>self.__next_f.push([1,"24:[\"$\",\"$L11\",null,{\"id\":\"adengine-manual-auction\",\"type\":\"text/javascript\",\"children\":\"$35\"}]\n"])</script><script>self.__next_f.push([1,"36:I[86869,[],\"IconMark\"]\n"])</script><script>self.__next_f.push([1,"37:I[84150,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"38:I[29725,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"SnigelTop\"]\n"])</script><script>self.__next_f.push([1,"39:I[13634,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"3a:I[82443,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"3b:I[95587,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"3c:I[3757,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"3d:I[98500,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"\"]\n"])</script><script>self.__next_f.push([1,"3e:I[54520,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"3f:I[52161,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"40:I[32751,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"a:{\"metadata\":[[\"$\",\"title\",\"0\",{\"children\":\"Frontend | Вопросы собесов - إحصائيات وتحليلات قناة تيليجرام @easy_javascript_ru\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"حلل قناة تيليجرام Frontend | Вопросы собесов على Telemetrio. إحصاءات كاملة: 17 867 مشتركًا، وصول المنشورات، ديناميكيات النمو وتصنيف @easy_javascript_ru في فئة CATEGORIES.technology \u0026 applications.\"}],[\"$\",\"meta\",\"2\",{\"name\":\"author\",\"content\":\"telemetr.io\"}],[\"$\",\"link\",\"3\",{\"rel\":\"manifest\",\"href\":\"/manifest.webmanifest\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"meta\",\"4\",{\"name\":\"keywords\",\"content\":\"telegram channel, channel, telegram, Frontend | Вопросы собесов, @easy_javascript_ru\"}],[\"$\",\"link\",\"5\",{\"rel\":\"canonical\",\"href\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"6\",{\"rel\":\"alternate\",\"hrefLang\":\"x-default\",\"href\":\"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"7\",{\"rel\":\"alternate\",\"hrefLang\":\"en\",\"href\":\"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"8\",{\"rel\":\"alternate\",\"hrefLang\":\"ar\",\"href\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"9\",{\"rel\":\"alternate\",\"hrefLang\":\"es\",\"href\":\"https://telemetr.io/es/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"10\",{\"rel\":\"alternate\",\"hrefLang\":\"fa\",\"href\":\"https://telemetr.io/fa/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"11\",{\"rel\":\"alternate\",\"hrefLang\":\"ru\",\"href\":\"https://telemetr.io/ru/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"12\",{\"rel\":\"alternate\",\"hrefLang\":\"uk\",\"href\":\"https://telemetr.io/uk/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"13\",{\"rel\":\"alternate\",\"hrefLang\":\"uz\",\"href\":\"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"link\",\"14\",{\"rel\":\"alternate\",\"hrefLang\":\"zh\",\"href\":\"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts\"}],[\"$\",\"meta\",\"15\",{\"property\":\"og:title\",\"content\":\"Frontend | Вопросы собесов - إحصائيات وتحليلات قناة تيليجرام @easy_javascript_ru\"}],[\"$\",\"meta\",\"16\",{\"property\":\"og:description\",\"content\":\"حلل قناة تيليجرام Frontend | Вопросы собесов على Telemetrio. إحصاءات كاملة: 17 867 مشتركًا، وصول المنشورات، ديناميكيات النمو وتصنيف @easy_javascript_ru في فئة CATEGORIES.technology \u0026 applications.\"}],[\"$\",\"meta\",\"17\",{\"name\":\"twitter:card\",\"content\":\"summary\"}],[\"$\",\"meta\",\"18\",{\"name\":\"twitter:title\",\"content\":\"Frontend | Вопросы собесов - إحصائيات وتحليلات قناة تيليجرام @easy_javascript_ru\"}],[\"$\",\"meta\",\"19\",{\"name\":\"twitter:description\",\"content\":\"حلل قناة تيليجرام Frontend | Вопросы собесов على Telemetrio. إحصاءات كاملة: 17 867 مشتركًا، وصول المنشورات، ديناميكيات النمو وتصنيف @easy_javascript_ru في فئة CATEGORIES.technology \u0026 applications.\"}],[\"$\",\"link\",\"20\",{\"rel\":\"icon\",\"href\":\"/favicon.ico\",\"type\":\"image/x-icon\",\"sizes\":\"32x32\"}],[\"$\",\"link\",\"21\",{\"rel\":\"icon\",\"href\":\"/icon.svg?9e8ae486b6590917\",\"type\":\"image/svg+xml\",\"sizes\":\"any\"}],[\"$\",\"link\",\"22\",{\"rel\":\"icon\",\"href\":\"/icon1.ico?6bbf3a51efb3e540\",\"type\":\"image/x-icon\",\"sizes\":\"16x16\"}],[\"$\",\"link\",\"23\",{\"rel\":\"icon\",\"href\":\"/icon2.ico?4e3fe26fdc910605\",\"type\":\"image/x-icon\",\"sizes\":\"24x24\"}],[\"$\",\"link\",\"24\",{\"rel\":\"icon\",\"href\":\"/icon3.ico?13288ad692c389e6\",\"type\":\"image/x-icon\",\"sizes\":\"48x48\"}],[\"$\",\"link\",\"25\",{\"rel\":\"icon\",\"href\":\"/icon4.ico?802efc8d36f2fee9\",\"type\":\"image/x-icon\",\"sizes\":\"64x64\"}],[\"$\",\"link\",\"26\",{\"rel\":\"icon\",\"href\":\"/icon5.ico?f2d52d5dccdccc0b\",\"type\":\"image/x-icon\",\"sizes\":\"96x96\"}],[\"$\",\"link\",\"27\",{\"rel\":\"icon\",\"href\":\"/icon6.ico?2f133ca7e18ea7a3\",\"type\":\"image/x-icon\",\"sizes\":\"144x144\"}],[\"$\",\"link\",\"28\",{\"rel\":\"apple-touch-icon\",\"href\":\"/apple-icon.png?a9b2beb703eb6cf6\",\"type\":\"image/png\",\"sizes\":\"180x180\"}],[\"$\",\"$L36\",\"29\",{}]],\"error\":null,\"digest\":\"$undefined\"}\n"])</script><script>self.__next_f.push([1,"f:\"$a:metadata\"\n"])</script><script>self.__next_f.push([1,"5:[[\"$\",\"$L37\",null,{\"channelInfo\":{\"id\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"title\":\"Frontend | Вопросы собесов\",\"about\":\"Сайт: https://easyoffer.ru/\\nВсе каналы: t.me/+xGeAw6ckJ4liYzQy\\n\\nКонтакт для рекламы: @easyoffer_adv\",\"membersCount\":17867,\"peer\":\"PEER_TYPE_CHANNEL\",\"privacy\":\"CHAT_PRIVACY_PUBLIC\",\"username\":\"easy_javascript_ru\",\"inviteLink\":\"UQwQa_915h8zYTUy\",\"photoId\":\"5431453649143450783\",\"photoUrl\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=l\",\"telegramFlags\":{\"verified\":false,\"scam\":false,\"fake\":false,\"restricted\":false},\"collectorFlags\":{\"verified\":false,\"cheater\":false,\"blocked\":false,\"onlyForOwners\":false,\"cheaterInfo\":{\"participants\":0.21322321891784668,\"views\":0.19698961079120636,\"appeal\":false,\"updatedAt\":\"2026-08-22T20:20:42Z\",\"reason\":\"CHEATER_REASON_UNSPECIFIED\"}},\"language\":{\"id\":{\"languageId\":\"ru\"},\"name\":\"ru\",\"position\":35114},\"country\":{\"id\":{\"countryId\":\"russia\"},\"name\":\"russia\",\"position\":36827},\"category\":[{\"id\":{\"categoryId\":\"1Y5Zq3WYB\",\"slug\":\"technology-and-applications\"},\"name\":\"technology \u0026 applications\",\"blocked\":false,\"position\":7139}],\"updatedAt\":\"2026-08-29T19:20:30Z\",\"channelCreation\":{\"title\":\"👾 JavaScript\",\"date\":\"2023-10-16T21:15:58Z\"},\"channelNet\":{\"id\":\"easyoffer\",\"title\":\"easyoffer\",\"channelsCount\":55,\"membersChange\":{\"last7Days\":-150,\"last30Days\":1009},\"membersCount\":281540,\"postViews\":33194,\"er\":16.89209,\"photoUrl\":\"https://img.tlmtr.io/c/25JuzH/5375426771429745548?ty=x\",\"countries\":[{\"countryId\":\"russia\"}]},\"adsIndex\":27.840517,\"adsIndexGrade\":\"ADS_INDEX_GRADE_C\",\"tags\":{\"async\":20,\"await\":26,\"border\":35,\"css\":26,\"div\":20,\"dom\":21,\"false\":19,\"flex\":34,\"html\":46,\"input\":14,\"javascript\":32,\"radius\":17,\"tostring\":16,\"url\":17,\"браузер\":56,\"загрузка\":14,\"контекст\":15,\"ставь\":82,\"строка\":22,\"тег\":16},\"stableSlug\":\"1917151177-easy_javascript_ru\"}}],[\"$\",\"$L38\",null,{}],[[\"$\",\"$L39\",null,{\"channelInfo\":\"$5:0:props:channelInfo\",\"channelStatistics\":{\"id\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"title\":\"Frontend | Вопросы собесов\",\"username\":\"easy_javascript_ru\",\"membersCount\":17867,\"peer\":\"PEER_TYPE_CHANNEL\",\"channelStats\":{\"updatedAt\":\"2026-08-28T00:00:00Z\",\"membersCount\":17873,\"membersChange\":{\"tomorrow\":-6,\"last7Days\":-45,\"last30Days\":-168,\"last90Days\":-492},\"messagesCount\":{\"tomorrow\":3,\"last7Days\":34,\"last30Days\":116},\"mentions\":{\"allTime\":1206},\"forwards\":{\"allTime\":1},\"engagementRate\":{\"avgPercent\":6.719633,\"after24HourPercent\":4.4704304,\"after48HourPercent\":5.0467186,\"after72HourPercent\":5.499916},\"postViews\":{\"after24Hour\":799,\"after48Hour\":902,\"after72Hour\":983},\"postsPerDayAvg\":3,\"engagementShallow\":{\"byMessagesCount\":51,\"viewsAvg\":1201,\"reactionsAvg\":4,\"commentsAvg\":0,\"forwardsAvg\":4},\"engagementDeep\":{\"byMessagesCount\":274,\"viewsAvg\":1345,\"reactionsAvg\":6,\"commentsAvg\":0,\"forwardsAvg\":4},\"tgRecommendations\":{\"recommendations\":43,\"membersCount\":350824}},\"telegramStats\":null},\"currentPage\":\"$undefined\"}],[\"$\",\"$L3a\",null,{\"isAdmin\":false,\"verified\":false}],[\"$\",\"$L3b\",null,{\"channelId\":\"1917151177\",\"hasServerAccess\":true,\"channelsLimit\":\"$undefined\",\"channelStatistics\":\"$5:2:0:props:channelStatistics\",\"channelInfo\":\"$5:0:props:channelInfo\",\"children\":[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]],[\"$\",\"$L3c\",null,{\"channelInfo\":\"$5:0:props:channelInfo\"}],[\"$\",\"nav\",null,{\"aria-label\":\"Breadcrumb\",\"className\":\"hidden\",\"children\":[[\"$\",\"ol\",null,{\"className\":\"breadcrumb\",\"children\":[[\"$\",\"li\",\"1\",{\"children\":[\"$\",\"$L3d\",null,{\"href\":\"https://telemetr.io\",\"prefetch\":false,\"children\":\"Telemetrio\"}]}],[\"$\",\"li\",\"2\",{\"children\":[\"$\",\"$L3d\",null,{\"href\":\"https://telemetr.io/ar/catalog/russia\",\"prefetch\":false,\"children\":\"روسيا\"}]}],[\"$\",\"li\",\"3\",{\"children\":[\"$\",\"$L3d\",null,{\"href\":\"https://telemetr.io/ar/catalog/russia/technology-and-applications\",\"prefetch\":false,\"children\":\"التكنولوجيات والتطبيقات\"}]}],[\"$\",\"li\",\"4\",{\"children\":[\"$\",\"$L3d\",null,{\"href\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"prefetch\":false,\"children\":\"Frontend | Вопросы собесов\"}]}]]}],[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"BreadcrumbList\\\",\\\"itemListElement\\\":[{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":1,\\\"name\\\":\\\"Telemetrio\\\",\\\"item\\\":\\\"https://telemetr.io\\\"},{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":2,\\\"name\\\":\\\"روسيا\\\",\\\"item\\\":\\\"https://telemetr.io/ar/catalog/russia\\\"},{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":3,\\\"name\\\":\\\"التكنولوجيات والتطبيقات\\\",\\\"item\\\":\\\"https://telemetr.io/ar/catalog/russia/technology-and-applications\\\"},{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":4,\\\"name\\\":\\\"Frontend | Вопросы собесов\\\",\\\"item\\\":\\\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\\\"}]}\"}}]]}]]\n"])</script><script>self.__next_f.push([1,"41:Tee4f,"])</script><script>self.__next_f.push([1,"{\"@context\":\"https://schema.org\",\"@type\":\"ItemList\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2206\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2206\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2206\",\"headline\":\"🤔 Расскажи про memo в react React.memo — это функция в React, которая используется для оптимизации производит…\",\"articleBody\":\"🤔 Расскажи про memo в react\\n\\nReact.memo — это функция в React, которая используется для оптимизации производительности функциональных компонентов. Она предотвращает ненужные повторные рендеры, если пропсы компонента не изменились. \\n\\n🚩Зачем нужен `React.memo`? \\n\\nВ React каждый раз, когда родительский компонент обновляется, все его дочерние компоненты тоже ререндерятся, даже если их пропсы остались неизменными. Это может негативно сказаться на производительности, особенно если дочерний компонент выполняет сложные вычисления или рендерит большое количество данных. \\nReact.memo решает эту проблему, запоминая (мемоизируя) предыдущий результат рендера и сравнивая его с новыми пропсами. Если пропсы не изменились, компонент просто использует закэшированное представление, а не ререндерится. \\n\\n🚩Как использовать `React.memo`? \\n\\nReact.memo — это функция высшего порядка (HOC), которая оборачивает функциональный компонент\\nimport React from \\\"react\\\";\\n\\nconst MyComponent = ({ value }) =\u003e {\\n console.log(\\\"Рендер компонента!\\\");\\n return \u003cdiv\u003eЗначение: {value}\u003c/div\u003e;\\n};\\n\\n// Оборачиваем компонент в React.memo\\nconst MemoizedComponent = React.memo(MyComponent);\\n\\nexport default MemoizedComponent;\\n\\n🚩Пример без React.memo vs. с React.memo \\n\\nДопустим, у нас есть родительский компонент, который изменяет состояние при каждом клике\\nimport React, { useState } from \\\"react\\\";\\nimport MemoizedComponent from \\\"./MyComponent\\\";\\n\\nconst Parent = () =\u003e {\\n const [count, setCount] = useState(0);\\n\\n return (\\n \u003cdiv\u003e\\n \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003eУвеличить\u003c/button\u003e\\n \u003cMemoizedComponent value=\\\"Привет, мир!\\\" /\u003e\\n \u003c/div\u003e\\n );\\n};\\n\\nexport default Parent;\\n\\n🚩Когда НЕ стоит использовать `React.memo`? \\n\\nЕсли компонент всегда ререндерится из-за изменения пропсов – смысла в memo нет. \\nЕсли компонент рендерится быстро – оптимизация может быть ненужной, а проверка пропсов даже замедлит работу. \\nЕсли пропсы часто изменяются – кэширование теряет смысл, так как все равно ререндерится.\\n\\nСтавь 👍 и забирай 📚 Базу знаний\",\"datePublished\":\"2025-12-11T09:05:41Z\",\"dateModified\":\"2025-12-11T09:05:41Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":1884},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":8},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":13}]}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2205\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2205\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2205\",\"headline\":\"Бизнес 2026 — готовьтесь заранее Масштабная конференция про главные изменения для бизнеса в 2026 г. Налоговая…\",\"articleBody\":\"Бизнес 2026 — готовьтесь заранее\\n\\nМасштабная конференция про главные изменения для бизнеса в 2026 г.\\n\\nНалоговая реформа, продажи, прибыль, команда и партнёрство: практические идеи от экспертов Битрикс24, Точка Банк, Bidzaar и Smartway. \\n\\nУчаствуйте бесплатно — узнайте, что важно уже сейчас ✅ \\n\\nЗарегистрироваться\\n\\n#реклама 16+\\nbusiness2026.ru\\nО рекламодателе\",\"datePublished\":\"2025-12-11T02:17:40Z\",\"dateModified\":\"2025-12-13T00:39:49Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":1163}]}},{\"@type\":\"ListItem\",\"position\":3,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2204\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2204\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2204\",\"headline\":\"🤔 Что такое прогрессивный рендеринг? Это подход, при котором контент страницы отрисовывается по мере загрузки…\",\"articleBody\":\"🤔 Что такое прогрессивный рендеринг?\\n\\nЭто подход, при котором контент страницы отрисовывается по мере загрузки, а не дожидаясь полной загрузки всех ресурсов. Улучшает скорость восприятия и пользовательский опыт.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"datePublished\":\"2025-12-10T16:10:41Z\",\"dateModified\":\"2025-12-10T16:10:41Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":1979},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":9},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":5}]}},{\"@type\":\"ListItem\",\"position\":4,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2203\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2203\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2203\",\"headline\":\"🤔 Основные причины отказа от классовых компонентов в react? С появлением React Hooks в версии 16.8 (2019 год)…\",\"articleBody\":\"🤔 Основные причины отказа от классовых компонентов в react?\\n\\nС появлением React Hooks в версии 16.8 (2019 год) классовые компоненты стали устаревшим способом создания компонентов. Сегодня функциональные компоненты с хуками заменяют классы. Давайте разберем почему. \\n\\n🟠Меньше кода → чище и понятнее \\nФункциональные компоненты короче, читаются легче, а код становится чище. \\nclass Counter extends React.Component {\\n constructor(props) {\\n super(props);\\n this.state = { count: 0 };\\n }\\n\\n increment = () =\u003e {\\n this.setState({ count: this.state.count + 1 });\\n };\\n\\n render() {\\n return (\\n \u003cbutton onClick={this.increment}\u003e\\n Счетчик: {this.state.count}\\n \u003c/button\u003e\\n );\\n }\\n}\\n\\nФункциональный компонент (хуки делают код проще) \\nfunction Counter() {\\n const [count, setCount] = useState(0);\\n\\n return (\\n \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003e\\n Счетчик: {count}\\n \u003c/button\u003e\\n );\\n}\\n\\n🟠Легче управлять жизненным циклом (useEffect vs componentDidMount) \\nВ классах жизненный цикл* компонента состоит из нескольких методов (componentDidMount, componentDidUpdate, componentWillUnmount). \\nclass Timer extends React.Component {\\n constructor(props) {\\n super(props);\\n this.state = { time: 0 };\\n }\\n\\n componentDidMount() {\\n this.timer = setInterval(() =\u003e {\\n this.setState({ time: this.state.time + 1 });\\n }, 1000);\\n }\\n\\n componentWillUnmount() {\\n clearInterval(this.timer);\\n }\\n\\n render() {\\n return \u003cp\u003eВремя: {this.state.time} секунд\u003c/p\u003e;\\n }\\n}\\n\\nФункциональный компонент (хуки делают все проще) \\nfunction Timer() {\\n const [time, setTime] = useState(0);\\n\\n useEffect(() =\u003e {\\n const timer = setInterval(() =\u003e setTime(t =\u003e t + 1), 1000);\\n return () =\u003e clearInterval(timer);\\n }, []);\\n\\n return \u003cp\u003eВремя: {time} секунд\u003c/p\u003e;\\n}\\n\\n🟠Лучшая производительность (меньше потребления памяти) \\nКлассовые компоненты используют экземпляры классов, а функциональные компоненты – просто функции. \\nСоздают экземпляры this \\nОбрабатывают setState \\nХранят лишние связи и контексты \\nНе создают this \\nИспользуют только нужные данные \\nОптимизируются через React.memo\\nconst Button = React.memo(({ onClick }) =\u003e {\\n console.log(\\\"Ререндер кнопки\\\");\\n return \u003cbutton onClick={onClick}\u003eНажми\u003c/button\u003e;\\n});\\n\\nfunction App() {\\n const [count, setCount] = useState(0);\\n const increment = useCallback(() =\u003e setCount(c =\u003e c + 1), []);\\n\\n return (\\n \u003cdiv\u003e\\n \u003cp\u003eСчетчик: {count}\u003c/p\u003e\\n \u003cButton onClick={increment} /\u003e\\n \u003c/div\u003e\\n );\\n}\\n\\n🟠Легче переиспользовать логику (React Hooks vs HOC/Render Props) \\nРаньше в классах код переиспользовали через HOC и Render Props, но это делало код сложным. \\nfunction withLogging(WrappedComponent) {\\n return class extends React.Component {\\n componentDidMount() {\\n console.log(\\\"Компонент монтирован\\\");\\n }\\n render() {\\n return \u003cWrappedComponent {...this.props} /\u003e;\\n }\\n };\\n}\\n\\nХуки (useEffect) делают код чище \\nfunction useLogger() {\\n useEffect(() =\u003e console.log(\\\"Компонент монтирован\\\"), []);\\n}\\n\\nfunction MyComponent() {\\n useLogger();\\n return \u003cp\u003eПривет, мир!\u003c/p\u003e;\\n}\\n\\n🟠Функциональные компоненты – будущее React \\nReact официально рекомендует использовать функциональные компоненты \\nDan Abramov (разработчик React) \\nНовые фичи React (Suspense, Server Components) создаются для функциональных компонентов \\nКлассы не работают в React Server Components \\nБольшинство современных библиотек (Redux Toolkit, React Query) рассчитаны на хуки\\n\\nСтавь 👍 и забирай 📚 Базу знаний\",\"datePublished\":\"2025-12-10T09:05:40Z\",\"dateModified\":\"2025-12-10T09:05:40Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2149},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":8},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":15}]}},{\"@type\":\"ListItem\",\"position\":5,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2202\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2202\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2202\",\"headline\":\"Где вести задачи и проекты? Конечно, в Битрикс24 Бесплатный онлайн-сервис для бизнеса и совместной работы. По…\",\"articleBody\":\"Где вести задачи и проекты? Конечно, в Битрикс24\\n\\nБесплатный онлайн-сервис для бизнеса и совместной работы. Полный комплект для работы без хаоса.\\nСтавьте первую задачу прямо сейчас \\n\\nНачать\\n\\n#реклама 16+\\ntask-24.bitrix24.ru\\nО рекламодателе\",\"datePublished\":\"2025-12-09T20:12:58Z\",\"dateModified\":\"2025-12-15T13:49:40Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":1443},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":2}]}},{\"@type\":\"ListItem\",\"position\":6,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2201\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2201\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2201\",\"headline\":\"🤔 Является ли Web Workers частью спецификации HTML5? Да, Web Workers — часть HTML5. Это механизм для многопот…\",\"articleBody\":\"🤔 Является ли Web Workers частью спецификации HTML5?\\n\\nДа, Web Workers — часть HTML5. Это механизм для многопоточности в браузере: выполнение кода в фоновом потоке, без блокировки UI.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"datePublished\":\"2025-12-09T16:10:39Z\",\"dateModified\":\"2025-12-09T16:10:39Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2146},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":11},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":5}]}},{\"@type\":\"ListItem\",\"position\":7,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2200\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2200\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2200\",\"headline\":\"В бигтехе есть место не только для разработчиков В VK ценят каждого специалиста — от маркетологов до HR. По с…\",\"articleBody\":\"В бигтехе есть место не только для разработчиков\\n\\nВ VK ценят каждого специалиста — от маркетологов до HR. По ссылке — истории сотрудников, которые меняют продукты компании без единой строчки кода. Смотрите ролики и вакансии, где вы точно сможете проявить себя. \\n\\nПерейти на сайт\\n\\n#реклама 16+\\nvkteam.ru\\nО рекламодателе\",\"datePublished\":\"2025-12-09T11:20:35Z\",\"dateModified\":\"2025-12-11T09:26:42Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":1630}]}},{\"@type\":\"ListItem\",\"position\":8,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2199\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2199\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2199\",\"headline\":\"🤔 Какие есть проблемы у di? Dependency Injection (DI) — это паттерн, который упрощает управление зависимостям…\",\"articleBody\":\"🤔 Какие есть проблемы у di?\\n\\nDependency Injection (DI) — это паттерн, который упрощает управление зависимостями, но у него есть свои сложности и недостатки. \\n\\n🟠Усложнение кода и архитектуры \\nПри использовании DI код может стать излишне сложным, особенно если внедрение зависимостей реализуется вручную или через сложные контейнеры. \\nclass Service {\\n constructor(repository) {\\n this.repository = repository;\\n }\\n}\\n\\n🟠Производительность (затраты на создание объектов) \\nЕсли DI используется через контейнеры, они могут замедлять выполнение программы, так как: \\nСоздание объектов может занимать больше времени (особенно при ленивой инициализации). \\nПоиск зависимостей в контейнере тоже требует времени. \\nВ Angular, NestJS и других фреймворках DI может потреблять больше ресурсов, чем обычное создание объектов. \\n\\n🟠Скрытая сложность и магия \\nКогда зависимости внедряются автоматически через контейнер, код становится менее очевидным. \\n@Injectable()\\nclass Service {\\n constructor(private readonly repository: Repository) {}\\n}\\n\\n🟠Проблемы с тестированием \\nХотя DI часто называют удобным для тестирования, на практике могут возникнуть сложности: \\nЕсли контейнер создаёт объекты динамически, тесты могут работать нестабильно. \\nНужно явно мокать зависимости, что может усложнять настройку тестов. \\nclass Service {\\n constructor(repository) {\\n this.repository = repository;\\n }\\n}\\n\\nconst service = new Service(new Repository()); // Проблема при тестировании – жестко задана зависимость\\n\\nЗдесь тестировать Service сложно, потому что Repository создаётся вручную. Приходится использовать мок-объекты\\nconst mockRepository = { getData: () =\u003e \\\"mock data\\\" };\\nconst service = new Service(mockRepository);\\n\\n🟠DI не всегда нужен \\nВ маленьких проектах использование DI может быть излишним. Простое создание объектов может быть проще и понятнее, чем настройка DI-контейнера. \\nconst repository = new Repository();\\nconst service = new Service(repository);\\n\\nСтавь 👍 и забирай 📚 Базу знаний\",\"datePublished\":\"2025-12-09T09:05:40Z\",\"dateModified\":\"2025-12-09T09:05:40Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2372},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":6},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":14}]}},{\"@type\":\"ListItem\",\"position\":9,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2198\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2198\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2198\",\"headline\":\"🤔 Что известно про memo в React? React.memo — это HOC (Higher-Order Component), который позволяет избежать ли…\",\"articleBody\":\"🤔 Что известно про memo в React?\\n\\nReact.memo — это HOC (Higher-Order Component), который позволяет избежать лишнего рендера, если пропсы не изменились.\\nReact.memo сравнивает предыдущие и новые пропсы (shallow comparison) и перерисовывает компонент только при их изменении. Можно передать кастомную функцию сравнения как второй аргумент для тонкой настройки.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"datePublished\":\"2025-12-08T16:10:39Z\",\"dateModified\":\"2025-12-08T16:10:39Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2168},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":12},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":11}]}},{\"@type\":\"ListItem\",\"position\":10,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2197\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2197\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2197\",\"headline\":\"📺 База 1000+ реальных собеседований На программиста, тестировщика, аналитика, проджекта и другие IT профы. Ес…\",\"articleBody\":\"📺 База 1000+ реальных собеседований\\n\\nНа программиста, тестировщика, аналитика, проджекта и другие IT профы. \\n\\nЕсть собесы от ведущих компаний: Сбер, Яндекс, ВТБ, Тинькофф, Озон, Wildberries и т.д.\\n\\n🎯 Переходи по ссылке и присоединяйся к базе, чтобы прокачать свои шансы на успешное трудоустройство!\",\"datePublished\":\"2025-12-08T11:12:03Z\",\"dateModified\":\"2025-12-08T11:12:03Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2306},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":4}]}},{\"@type\":\"ListItem\",\"position\":11,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2196\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2196\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2196\",\"headline\":\"🤔 Для чего скрипт подключают в концe body? Основная причина – ускорение загрузки страницы и избежание блокиро…\",\"articleBody\":\"🤔 Для чего скрипт подключают в концe body? \\n\\nОсновная причина – ускорение загрузки страницы и избежание блокировки рендеринга. \\n\\nКогда браузер загружает HTML, он читает код сверху вниз. Если в \u003chead\u003e встречается \u003cscript\u003e, браузер останавливает разбор HTML, загружает и выполняет скрипт, а только потом продолжает загружать страницу. \\n\\n🟠Проблема: блокировка рендеринга \\nЕсли скрипт загружается в \u003chead\u003e, он останавливает отрисовку страницы до завершения загрузки. \\n\u003chead\u003e\\n \u003cscript src=\\\"script.js\\\"\u003e\u003c/script\u003e \u003c!-- ❌ Плохо: блокирует рендеринг --\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n \u003ch1\u003eСайт загружается...\u003c/h1\u003e\\n\u003c/body\u003e\\n\\n🟠Решение: подключение в конце `\u003cbody\u003e` \\nЕсли разместить \u003cscript\u003e перед закрывающим \u003c/body\u003e, сначала загружается контент страницы, а потом выполняется JavaScript. \\n\u003cbody\u003e\\n \u003ch1\u003eКонтент загрузился!\u003c/h1\u003e\\n \u003cscript src=\\\"script.js\\\"\u003e\u003c/script\u003e \u003c!-- Хорошо: не блокирует рендеринг --\u003e\\n\u003c/body\u003e\\n\\n🟠Альтернативы: `defer` и `async` \\ndefer – отложенное выполнение после загрузки HTML\\n\u003chead\u003e\\n \u003cscript src=\\\"script.js\\\" defer\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\\nasync – загрузка и выполнение параллельно \\n\u003chead\u003e\\n \u003cscript src=\\\"script.js\\\" async\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\\nСтавь 👍 и забирай 📚 Базу знаний\",\"datePublished\":\"2025-12-08T09:05:40Z\",\"dateModified\":\"2025-12-08T09:05:40Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2183},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":8},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":17}]}},{\"@type\":\"ListItem\",\"position\":12,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2195\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2195\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2195\",\"headline\":\"Тютю-гребень или капикрыса? Побалуйте себя роскошью от Ричарда Сапогова или утепляйтесь с культовой рубашкой…\",\"articleBody\":\"Тютю-гребень или капикрыса?\\n\\nПобалуйте себя роскошью от Ричарда Сапогова или утепляйтесь с культовой рубашкой Инженера. Выбирайте фаворитов из коллекции с персонажами Антона Лапенко. \\n\\nПерейти на сайт\\n\\n#реклама \\ntbank.ru\\nО рекламодателе\",\"datePublished\":\"2025-12-07T23:50:00Z\",\"dateModified\":\"2025-12-09T21:50:06Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":1517},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":2}]}},{\"@type\":\"ListItem\",\"position\":13,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2194\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2194\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2194\",\"headline\":\"🤔 Что известно про graceful shutdown и где применяется? Graceful shutdown — это корректное завершение работы…\",\"articleBody\":\"🤔 Что известно про graceful shutdown и где применяется?\\n\\nGraceful shutdown — это корректное завершение работы приложения:\\n- Завершение активных соединений;\\n- Очистка ресурсов (например, соединений с БД);\\n- Применяется в серверных приложениях, микросервисах, особенно при развертывании и обновлении.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"datePublished\":\"2025-12-07T16:10:38Z\",\"dateModified\":\"2025-12-07T16:10:38Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2106},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":5},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":4}]}},{\"@type\":\"ListItem\",\"position\":14,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2193\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2193\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2193\",\"headline\":\"🤔 Какие используешь подходы для написания приложения которую проще поддерживать, чем делать первоначальную ра…\",\"articleBody\":\"🤔 Какие используешь подходы для написания приложения которую проще поддерживать, чем делать первоначальную разработку?\\n\\nПри разработке frontend-приложений, которые в будущем будет проще поддерживать и масштабировать, я придерживаюсь ряда ключевых подходов. \\n\\n🟠Разделение ответственности (Separation of Concerns)\\nЭто значит, что код должен быть разделен по зонам ответственности. В frontend-разработке это проявляется в: \\nЧистом разделении логики, представления и данных (например, с помощью архитектуры MVC, MVVM или FLUX). \\nИспользовании компонентов в React/Vue или шаблонов в Angular. \\nРазделении CSS, JS и HTML, либо использовании методологий, где стили хранятся рядом с компонентом (CSS Modules, Styled Components). \\nВместо того, чтобы писать всю логику и разметку в одном файле: \\nfunction App() {\\n const [count, setCount] = useState(0);\\n return \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003eCount: {count}\u003c/button\u003e;\\n}\\n \\n\\nЯ разделяю бизнес-логику и представление\\n// CounterLogic.js\\nexport function useCounter() {\\n const [count, setCount] = useState(0);\\n const increment = () =\u003e setCount(count + 1);\\n return { count, increment };\\n}\\n\\n// Counter.js\\nimport { useCounter } from \\\"./CounterLogic\\\";\\nfunction Counter() {\\n const { count, increment } = useCounter();\\n return \u003cbutton onClick={increment}\u003eCount: {count}\u003c/button\u003e;\\n}\\n \\n\\n🟠Компонентный подход и повторное использование кода\\nFrontend-приложения должны строиться из переиспользуемых и изолированных компонентов. Это уменьшает дублирование кода и делает его понятным. \\n// Button.js (переиспользуемый компонент)\\nfunction Button({ onClick, children }) {\\n return \u003cbutton onClick={onClick}\u003e{children}\u003c/button\u003e;\\n}\\n\\n// Counter.js (использует Button)\\nfunction Counter() {\\n const [count, setCount] = useState(0);\\n return \u003cButton onClick={() =\u003e setCount(count + 1)}\u003eCount: {count}\u003c/Button\u003e;\\n}\\n \\n\\n🟠Чистый код и читаемость\\nКод должен быть понятным не только мне, но и другим разработчикам. \\nПонятные имена переменных и функций. Вместо x → userAge, вместо doSmth() → calculateTotalPrice(). \\nМеньше вложенности. Вместо кучи if и else, лучше использовать early return. \\nРазбиение кода на модули. Один файл = одна зона ответственности. \\nfunction getDiscountedPrice(price, discount) {\\n if (discount \u003c= 0) return price;\\n return price - price * (discount / 100);\\n}\\n \\n\\n🟠Состояние приложения: локальное vs глобальное\\nВ зависимости от сложности приложения нужно правильно управлять состоянием: \\nЛокальное состояние – useState (React), ref (Vue) для простых данных внутри компонента. \\nГлобальное состояние – Redux, MobX, Zustand, Pinia, Context API – когда данные нужны многим компонентам. \\nСерверное состояние – React Query, SWR – когда данные приходят с API и их нужно кешировать. \\n\\n🟠Следование принципам SOLID и DRY\\nDRY (Don't Repeat Yourself) – не повторяем код, используем функции, хуки, компоненты. \\nSOLID – например, принцип единственной ответственности (Single Responsibility Principle) гласит, что каждый компонент или функция должны решать только одну задачу. \\nfunction sendEmailAndSaveToDB(user) {\\n sendEmail(user.email);\\n saveUserToDatabase(user);\\n}\\n\\nЛучше разделить логику\\nfunction sendEmail(email) { /* отправка письма */ }\\nfunction saveUserToDatabase(user) { /* сохранение в БД */ }\\nfunction registerUser(user) {\\n sendEmail(user.email);\\n saveUserToDatabase(user);\\n}\\n\\n🟠Использование TypeScript\\nTypeScript помогает избежать ошибок и делать код предсказуемым. \\ntype User = {\\n id: number;\\n name: string;\\n};\\n\\nfunction getUserName(user: User): string {\\n return user.name;\\n}\\n \\n\\n🟠Документация и кодстайл\\nESLint + Prettier → автоформатирование и проверка стиля. \\nJSDoc/TypeScript → документация функций и типов данных. \\nStorybook → для документирования UI-компонентов.\\n\\nСтавь 👍 и забирай 📚 Базу знаний\",\"datePublished\":\"2025-12-07T09:05:40Z\",\"dateModified\":\"2025-12-07T09:05:40Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2085},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":3},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":21}]}},{\"@type\":\"ListItem\",\"position\":15,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2192\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2192\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2192\",\"headline\":\"🤔 Как использовать селектор? Селектор в CSS используется для выбора элементов по тегу, классу, ID или атрибут…\",\"articleBody\":\"🤔 Как использовать селектор?\\n\\nСелектор в CSS используется для выбора элементов по тегу, классу, ID или атрибуту. \\nВ JS селекторы используются через document.querySelector() или useRef в React.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"datePublished\":\"2025-12-06T16:10:39Z\",\"dateModified\":\"2025-12-06T16:10:39Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2036},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":7},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":4}]}},{\"@type\":\"ListItem\",\"position\":16,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2191\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2191\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2191\",\"headline\":\"🤔 В чем различие методов call apply bind? Методы call, apply и bind принадлежат к функциональному объекту Fun…\",\"articleBody\":\"🤔 В чем различие методов call apply bind? \\n\\nМетоды call, apply и bind принадлежат к функциональному объекту Function и используются для указания контекста this при вызове функции. Хотя все три метода позволяют контролировать значение this внутри функции, между ними существуют ключевые различия в способе использования и поведении.\\n\\n🚩Сall\\n\\nВызывает функцию, явно устанавливая this в первом аргументе. Остальные аргументы передаются в вызываемую функцию как есть.\\nfunction greet(message, name) {\\n console.log(${message}, ${name}. This is ${this});\\n}\\n\\ngreet.call(\\\"Earth\\\", \\\"Hello\\\", \\\"Alice\\\"); // \\\"Hello, Alice. This is Earth\\\"\\n\\n🚩Apply\\n\\nОчень похож на call, но принимает аргументы в виде массива, а не по отдельности.\\nfunction greet(message, name) {\\n console.log(\\n${message}, ${name}. This is ${this}\\n);\\n}\\n\\ngreet.apply(\\\"Earth\\\", [\\\"Hello\\\", \\\"Alice\\\"]); // \\\"Hello, Alice. This is Earth\\\"\\n\\n🚩Bind\\n\\nСоздаёт новую функцию, которая, когда она вызывается, имеет установленный контекст this, указанный в первом аргументе. В отличие от call и apply, bind не вызывает функцию сразу, а возвращает новую функцию, которую можно вызвать позже.\\nfunction greet(message, name) {\\n console.log(\\n${message}, ${name}. This is ${this}\\n);\\n}\\n\\nconst greetEarth = greet.bind(\\\"Earth\\\", \\\"Hello\\\", \\\"Alice\\\");\\ngreetEarth(); // \\\"Hello, Alice. This is Earth\\\"\\n\\nСтавь 👍 и забирай 📚 Базу знаний\",\"datePublished\":\"2025-12-06T09:05:40Z\",\"dateModified\":\"2025-12-06T09:05:40Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2287},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":7},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":20}]}},{\"@type\":\"ListItem\",\"position\":17,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2190\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2190\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2190\",\"headline\":\"Видовые квартиры в Ялте с собственным пляжем ЖК \\\"Юсуповский\\\" — ваша личная резиденция бизнес-класса на берегу…\",\"articleBody\":\"Видовые квартиры в Ялте с собственным пляжем\\n\\nЖК \\\"Юсуповский\\\" — ваша личная резиденция бизнес-класса на берегу моря!\\nЗдесь каждый элемент говорит о статусе: от величественного фасада до 2-этажного SPA и фитнес-центра на территории.\\n\\n✅ Панорамное остекление\\n✅ Открытый подогреваемый бассейн и закрытый двор-парк 2 га\\n✅ 2-этажные квартиры\\n✅ Трансфер к пляжу\\n✅ Реликтовый парк и водопад на территории.\\n\\nВсего в нескольких минутах езды: Ливадийский дворец, Солнечная тропа, ведущая вдоль побережья, а также лучшие рестораны и культурные, развлекательные объекты Ялты.\\n\\nЭто инвестиция в будущее: Ваш второй дом и источник вдохновения для будущих поколений.\\n\\nДо 30 ноября 2025 года вы можете купить квартиры в рассрочку 0%. Не упустите эту возможность! \\n\\nКупить\\n\\nПроектная декларация на сайте https://наш.дом.рф/. Застройщик: ООО СЗ ВОЛГА. Финансовые услуги оказывает: ПАО \\\"Сбербанк\\\".\\n\\n#реклама \\ngk-yusupovskiy.ru\\nО рекламодателе\",\"datePublished\":\"2025-12-05T22:45:16Z\",\"dateModified\":\"2025-12-07T20:52:11Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":1348},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":2}]}},{\"@type\":\"ListItem\",\"position\":18,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2189\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2189\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2189\",\"headline\":\"🤔 Как делать HTML-форму? HTML-форма создается с помощью тега \u003cform\u003e, внутри которого размещаются элементы упр…\",\"articleBody\":\"🤔 Как делать HTML-форму?\\n\\nHTML-форма создается с помощью тега \u003cform\u003e, внутри которого размещаются элементы управления: \u003cinput\u003e, \u003cselect\u003e, \u003ctextarea\u003e, \u003cbutton\u003e. Атрибуты action и method указывают, куда и каким способом отправлять данные. Например, \u003cform method=\\\"post\\\" action=\\\"/submit\\\"\u003e.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"datePublished\":\"2025-12-05T16:10:38Z\",\"dateModified\":\"2025-12-05T16:10:38Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2146},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":8},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":4}]}},{\"@type\":\"ListItem\",\"position\":19,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2188\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2188\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2188\",\"headline\":\"🤔 Как растянуть элемент на 100%? Чтобы растянуть элемент на 100% (по ширине, высоте или обоим направлениям),…\",\"articleBody\":\"🤔 Как растянуть элемент на 100%?\\n\\nЧтобы растянуть элемент на 100% (по ширине, высоте или обоим направлениям), нужно понимать контекст, от чего \\\"100%\\\" будет вычисляться. Значение 100% в CSS основывается на родительском элементе. Рассмотрим различные случаи и подходы.\\n\\n🟠Растяжение элемента на 100% ширины (`width: 100%;`)\\nЭлемент займет всю ширину своего родителя.\\n\u003cdiv style=\\\"width: 300px; background: lightblue;\\\"\u003e\\n \u003cdiv style=\\\"width: 100%; background: coral;\\\"\u003eЯ растянут по ширине!\u003c/div\u003e\\n\u003c/div\u003e\\n\\n🟠Растяжение элемента на 100% высоты (`height: 100%;`)\\nЭлемент займет всю высоту родительского элемента.\\n\u003cdiv style=\\\"height: 300px; background: lightblue;\\\"\u003e\\n \u003cdiv style=\\\"height: 100%; background: coral;\\\"\u003eЯ растянут по высоте!\u003c/div\u003e\\n\u003c/div\u003e\\n\\n🟠Растяжение элемента на 100% ширины и высоты\\nДля растяжения элемента как по ширине, так и по высоте относительно родителя используются width: 100%; и height: 100%;.\\n\u003cdiv style=\\\"width: 300px; height: 300px; background: lightblue;\\\"\u003e\\n \u003cdiv style=\\\"width: 100%; height: 100%; background: coral;\\\"\u003eРастянут по ширине и высоте!\u003c/div\u003e\\n\u003c/div\u003e\\n\\n🟠Растяжение относительно окна браузера (`viewport`)\\nЕсли элемент нужно растянуть на весь экран, используются единицы 100vw (ширина окна) и 100vh (высота окна).\\n\u003cdiv style=\\\"width: 100vw; height: 100vh; background: coral;\\\"\u003e\\n Я растянут на весь экран!\\n\u003c/div\u003e\\n\\nДля исключения полосы прокрутки можно использовать\\nwidth: calc(100vw - 16px); /* Учитывается ширина скролла */\\n\\n🟠Использование `position: absolute`\\nКогда нужно растянуть элемент независимо от размера его содержимого, можно использовать position: absolute.\\n\u003cdiv style=\\\"position: relative; width: 300px; height: 300px; background: lightblue;\\\"\u003e\\n \u003cdiv style=\\\"position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: coral;\\\"\u003e\\n Я растянут абсолютно!\\n \u003c/div\u003e\\n\u003c/div\u003e\\n\\n🟠Растяжение внутри Flexbox-контейнера\\nFlexbox автоматически растягивает вложенные элементы, если у них указаны свойства flex: 1 или align-items: stretch.\\n\u003cdiv style=\\\"display: flex; width: 300px; height: 300px; background: lightblue;\\\"\u003e\\n \u003cdiv style=\\\"flex: 1; background: coral;\\\"\u003eЯ растянут по Flexbox!\u003c/div\u003e\\n\u003c/div\u003e\\n\\n🟠Растяжение внутри Grid-контейнера\\nCSS Grid также позволяет растягивать элементы.\\n\u003cdiv style=\\\"display: grid; width: 300px; height: 300px; background: lightblue;\\\"\u003e\\n \u003cdiv style=\\\"width: 100%; height: 100%; background: coral;\\\"\u003eЯ растянут внутри Grid!\u003c/div\u003e\\n\u003c/div\u003e\\n\\n🟠Растяжение с учетом отступов\\nЕсли нужно учесть отступы (padding) или границы (border), используйте свойство box-sizing: border-box. Это гарантирует, что элемент с width: 100% и height: 100% не будет \\\"выходить за пределы\\\" из-за отступов.\\n\u003cdiv style=\\\"width: 300px; height: 300px; background: lightblue;\\\"\u003e\\n \u003cdiv style=\\\"width: 100%; height: 100%; padding: 20px; box-sizing: border-box; background: coral;\\\"\u003e\\n Я растянут с учетом отступов!\\n \u003c/div\u003e\\n\u003c/div\u003e\\n\\nСтавь 👍 и забирай 📚 Базу знаний\",\"datePublished\":\"2025-12-05T09:05:38Z\",\"dateModified\":\"2025-12-05T09:05:38Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2351},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":6},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":21}]}},{\"@type\":\"ListItem\",\"position\":20,\"item\":{\"@type\":\"SocialMediaPosting\",\"@id\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2187\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2187\",\"mainEntityOfPage\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru/posts/2187\",\"headline\":\"🤔 Как добавить класс на элемент по условию? Если тебе нужно применять стили к элементу в зависимости от каког…\",\"articleBody\":\"🤔 Как добавить класс на элемент по условию?\\n\\nЕсли тебе нужно применять стили к элементу в зависимости от какого-то состояния, Vue позволяет это сделать динамически. Ты просто указываешь, когда класс должен применяться, а когда нет. Это удобно для подсветки выбранных элементов, отображения ошибок или изменения внешнего вида по действиям пользователя.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"datePublished\":\"2025-12-04T16:10:38Z\",\"dateModified\":\"2025-12-04T16:10:38Z\",\"author\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"publisher\":{\"@type\":\"Organization\",\"name\":\"Frontend | Вопросы собесов\",\"url\":\"https://telemetr.io/ar/channels/1917151177-easy_javascript_ru\",\"image\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\"},\"commentCount\":0,\"interactionStatistic\":[{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ViewAction\",\"userInteractionCount\":2126},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/LikeAction\",\"userInteractionCount\":8},{\"@type\":\"InteractionCounter\",\"interactionType\":\"https://schema.org/ShareAction\",\"userInteractionCount\":5}]}}]}"])</script><script>self.__next_f.push([1,"6:[[\"$\",\"$L3e\",null,{\"page\":\"ch-archive-posts\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-row\",\"children\":[\"$\",\"span\",null,{\"className\":\"inline-flex max-w-full items-center gap-1 truncate font-semibold text-lg leading-[26px] lg:text-2xl mb-4 flex w-full flex-1 justify-center whitespace-nowrap md:mb-6 lg:justify-start gap-x-1.5 flex-none\",\"children\":[false,[\"$\",\"div\",null,{\"className\":\"grid flex-initial\",\"children\":[\"$\",\"span\",null,{\"className\":\"truncate\",\"children\":\"أرشيف المشاركات\"}]}],[\"$\",\"$L3f\",null,{\"className\":\"inline-flex\",\"title\":\"أرشيف منشورات القنوات\",\"description\":\"تخزن صفحة أرشيف البريد جميع مشاركات القناة منذ أن بدأت خوارزمية البحث في Telemetrio للخدمة في تتبع وجمع البيانات على القناة في صفحة التحليلات التي أنت منها.\",\"link\":\"$undefined\",\"onPopoverOpen\":\"$undefined\",\"children\":[\"$\",\"$L40\",null,{\"iconName\":\"info-circle\",\"className\":\"text-neutral3 text-[18px] lg:text-[24px]\"}]}]]}]}],[\"$\",\"div\",null,{\"className\":\"flex flex-col\",\"children\":[[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"$41\"}}],\"$L42\"]}]]\n"])</script><script>self.__next_f.push([1,"43:I[70614,[\"61772\",\"static/chunks/109f1dee-bb7f1a6e6851f245.js\",\"95555\",\"static/chunks/95555-501b0e877f3d4b1b.js\",\"55145\",\"static/chunks/55145-a151b800a95b0b07.js\",\"46631\",\"static/chunks/46631-761cd5c9238aa015.js\",\"22349\",\"static/chunks/22349-80ae4f6f2405f57e.js\",\"98500\",\"static/chunks/98500-24b62b998a44bf32.js\",\"38437\",\"static/chunks/38437-2e76d7b1eee09f45.js\",\"26708\",\"static/chunks/26708-086eb381c3947d6e.js\",\"90668\",\"static/chunks/90668-eb07e8a8f6110477.js\",\"8220\",\"static/chunks/8220-12f5eb929dccf297.js\",\"79424\",\"static/chunks/79424-e3b2ada7df94f945.js\",\"3600\",\"static/chunks/3600-e184d3e5776464a1.js\",\"96388\",\"static/chunks/96388-1de6c22126a55f5e.js\",\"16653\",\"static/chunks/16653-b100fc499dffa514.js\",\"64885\",\"static/chunks/64885-b5344dabc397aea8.js\",\"87022\",\"static/chunks/87022-e4ff488231796a8f.js\",\"22142\",\"static/chunks/22142-0102172a175e2d87.js\",\"49304\",\"static/chunks/49304-41bbf705f2f06f3d.js\",\"67198\",\"static/chunks/67198-ba4b5f9c79a33f31.js\",\"68285\",\"static/chunks/68285-ceb0d426acb0a020.js\",\"48129\",\"static/chunks/48129-25b38bb37751b498.js\",\"32739\",\"static/chunks/32739-f0a9a8607c59c2d1.js\",\"82215\",\"static/chunks/82215-2a2cdefcce4361f8.js\",\"14759\",\"static/chunks/14759-6fc471a96b34a047.js\",\"76309\",\"static/chunks/76309-99759eb144ae47c3.js\",\"7107\",\"static/chunks/7107-d8e5dc9ec047b4ba.js\",\"54294\",\"static/chunks/54294-2dd3127fa65a7599.js\",\"21391\",\"static/chunks/21391-284140f57606a968.js\",\"49077\",\"static/chunks/49077-f9364eb64661bf0d.js\",\"53839\",\"static/chunks/53839-2427c0a110689d72.js\",\"93113\",\"static/chunks/93113-759520015ac19644.js\",\"66986\",\"static/chunks/66986-c9a9d840e7021bcf.js\",\"75901\",\"static/chunks/75901-32bbe1dd49c0cbc0.js\",\"9878\",\"static/chunks/app/%5Blng%5D/(channel)/channels/%5Bid%5D/posts/page-de2100f12384a338.js\"],\"default\"]\n"])</script><script>self.__next_f.push([1,"44:Tc65,"])</script><script>self.__next_f.push([1,"🤔 Расскажи про memo в react\n\nReact.memo — это функция в React, которая используется для оптимизации производительности функциональных компонентов. Она предотвращает ненужные повторные рендеры, если пропсы компонента не изменились. \n\n🚩Зачем нужен `React.memo`? \n\nВ React каждый раз, когда родительский компонент обновляется, все его дочерние компоненты тоже ререндерятся, даже если их пропсы остались неизменными. Это может негативно сказаться на производительности, особенно если дочерний компонент выполняет сложные вычисления или рендерит большое количество данных. \nReact.memo решает эту проблему, запоминая (мемоизируя) предыдущий результат рендера и сравнивая его с новыми пропсами. Если пропсы не изменились, компонент просто использует закэшированное представление, а не ререндерится. \n\n🚩Как использовать `React.memo`? \n\nReact.memo — это функция высшего порядка (HOC), которая оборачивает функциональный компонент\nimport React from \"react\";\n\nconst MyComponent = ({ value }) =\u003e {\n console.log(\"Рендер компонента!\");\n return \u003cdiv\u003eЗначение: {value}\u003c/div\u003e;\n};\n\n// Оборачиваем компонент в React.memo\nconst MemoizedComponent = React.memo(MyComponent);\n\nexport default MemoizedComponent;\n\n🚩Пример без React.memo vs. с React.memo \n\nДопустим, у нас есть родительский компонент, который изменяет состояние при каждом клике\nimport React, { useState } from \"react\";\nimport MemoizedComponent from \"./MyComponent\";\n\nconst Parent = () =\u003e {\n const [count, setCount] = useState(0);\n\n return (\n \u003cdiv\u003e\n \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003eУвеличить\u003c/button\u003e\n \u003cMemoizedComponent value=\"Привет, мир!\" /\u003e\n \u003c/div\u003e\n );\n};\n\nexport default Parent;\n\n🚩Когда НЕ стоит использовать `React.memo`? \n\nЕсли компонент всегда ререндерится из-за изменения пропсов – смысла в memo нет. \nЕсли компонент рендерится быстро – оптимизация может быть ненужной, а проверка пропсов даже замедлит работу. \nЕсли пропсы часто изменяются – кэширование теряет смысл, так как все равно ререндерится.\n\nСтавь 👍 и забирай 📚 Базу знаний"])</script><script>self.__next_f.push([1,"45:T403,"])</script><script>self.__next_f.push([1,"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDZooooAKKQmmF8UDsSZoqHzM59qKdhE1IaWmscUgGO2KqySVLISexquY3c9Dj1q0hxkiaKRXGP4hRUP2fB+82fYUVVkJyRosqsMMAfrUMiKOiqPwoorOO5Mtiu2B0AH4UxJApIZRg+1FFbpJow5mSsu5P3Z2fToaKKKnbQq1z/2Q=="])</script><script>self.__next_f.push([1,"46:T1220,"])</script><script>self.__next_f.push([1,"🤔 Основные причины отказа от классовых компонентов в react?\n\nС появлением React Hooks в версии 16.8 (2019 год) классовые компоненты стали устаревшим способом создания компонентов. Сегодня функциональные компоненты с хуками заменяют классы. Давайте разберем почему. \n\n🟠Меньше кода → чище и понятнее \nФункциональные компоненты короче, читаются легче, а код становится чище. \nclass Counter extends React.Component {\n constructor(props) {\n super(props);\n this.state = { count: 0 };\n }\n\n increment = () =\u003e {\n this.setState({ count: this.state.count + 1 });\n };\n\n render() {\n return (\n \u003cbutton onClick={this.increment}\u003e\n Счетчик: {this.state.count}\n \u003c/button\u003e\n );\n }\n}\n\nФункциональный компонент (хуки делают код проще) \nfunction Counter() {\n const [count, setCount] = useState(0);\n\n return (\n \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003e\n Счетчик: {count}\n \u003c/button\u003e\n );\n}\n\n🟠Легче управлять жизненным циклом (useEffect vs componentDidMount) \nВ классах жизненный цикл* компонента состоит из нескольких методов (componentDidMount, componentDidUpdate, componentWillUnmount). \nclass Timer extends React.Component {\n constructor(props) {\n super(props);\n this.state = { time: 0 };\n }\n\n componentDidMount() {\n this.timer = setInterval(() =\u003e {\n this.setState({ time: this.state.time + 1 });\n }, 1000);\n }\n\n componentWillUnmount() {\n clearInterval(this.timer);\n }\n\n render() {\n return \u003cp\u003eВремя: {this.state.time} секунд\u003c/p\u003e;\n }\n}\n\nФункциональный компонент (хуки делают все проще) \nfunction Timer() {\n const [time, setTime] = useState(0);\n\n useEffect(() =\u003e {\n const timer = setInterval(() =\u003e setTime(t =\u003e t + 1), 1000);\n return () =\u003e clearInterval(timer);\n }, []);\n\n return \u003cp\u003eВремя: {time} секунд\u003c/p\u003e;\n}\n\n🟠Лучшая производительность (меньше потребления памяти) \nКлассовые компоненты используют экземпляры классов, а функциональные компоненты – просто функции. \nСоздают экземпляры this \nОбрабатывают setState \nХранят лишние связи и контексты \nНе создают this \nИспользуют только нужные данные \nОптимизируются через React.memo\nconst Button = React.memo(({ onClick }) =\u003e {\n console.log(\"Ререндер кнопки\");\n return \u003cbutton onClick={onClick}\u003eНажми\u003c/button\u003e;\n});\n\nfunction App() {\n const [count, setCount] = useState(0);\n const increment = useCallback(() =\u003e setCount(c =\u003e c + 1), []);\n\n return (\n \u003cdiv\u003e\n \u003cp\u003eСчетчик: {count}\u003c/p\u003e\n \u003cButton onClick={increment} /\u003e\n \u003c/div\u003e\n );\n}\n\n🟠Легче переиспользовать логику (React Hooks vs HOC/Render Props) \nРаньше в классах код переиспользовали через HOC и Render Props, но это делало код сложным. \nfunction withLogging(WrappedComponent) {\n return class extends React.Component {\n componentDidMount() {\n console.log(\"Компонент монтирован\");\n }\n render() {\n return \u003cWrappedComponent {...this.props} /\u003e;\n }\n };\n}\n\nХуки (useEffect) делают код чище \nfunction useLogger() {\n useEffect(() =\u003e console.log(\"Компонент монтирован\"), []);\n}\n\nfunction MyComponent() {\n useLogger();\n return \u003cp\u003eПривет, мир!\u003c/p\u003e;\n}\n\n🟠Функциональные компоненты – будущее React \nReact официально рекомендует использовать функциональные компоненты \nDan Abramov (разработчик React) \nНовые фичи React (Suspense, Server Components) создаются для функциональных компонентов \nКлассы не работают в React Server Components \nБольшинство современных библиотек (Redux Toolkit, React Query) рассчитаны на хуки\n\nСтавь 👍 и забирай 📚 Базу знаний"])</script><script>self.__next_f.push([1,"47:T477,"])</script><script>self.__next_f.push([1,"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwCG2jV7kLIPl5zk+1aKWVsx4AP0Y1TX5XDDqM1YE0jnarbCW7dh1roqyktURFLZlW5RYblkUYAx/KgW6/eU474qSSMyXLq5JOOSRxUJcxsVJJwcYzSjVvZCdO12W1VWXJGT0JoqKGTJxRVtNGdxtNHnCTdGM4p9LuGemPxpyjzKzOhqw3M5IJTn6moDBIZNzgA/Wre5fX+dN3D0z+NQqaTuRJu1gjXbRSZorRoyFxSo5TOMc0UUOKkrM7JIXzm9v1pruXxnHFFFQqUIu6Rixv40UUVoZNH/2Q=="])</script><script>self.__next_f.push([1,"48:T40f,"])</script><script>self.__next_f.push([1,"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAWACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwC+jbMlpC+e2Ki21HO2MjIAHXjNQnzXUiMyHj5TjFbRWlyOVydiztqOZtowMZI71USGcZ3LO/pk4/rSPazv0SQfVv8A69TzMFBJ6lhN7FVVunLZFFWYoSijJJbHPNFVclkzRIwO5QQfWmmEZGOAOwoorLyLI/swx1x26VKkIQ5zzRRQMftooooEf//Z"])</script><script>self.__next_f.push([1,"49:Tc5c,"])</script><script>self.__next_f.push([1,"🤔 Какие есть проблемы у di?\n\nDependency Injection (DI) — это паттерн, который упрощает управление зависимостями, но у него есть свои сложности и недостатки. \n\n🟠Усложнение кода и архитектуры \nПри использовании DI код может стать излишне сложным, особенно если внедрение зависимостей реализуется вручную или через сложные контейнеры. \nclass Service {\n constructor(repository) {\n this.repository = repository;\n }\n}\n\n🟠Производительность (затраты на создание объектов) \nЕсли DI используется через контейнеры, они могут замедлять выполнение программы, так как: \nСоздание объектов может занимать больше времени (особенно при ленивой инициализации). \nПоиск зависимостей в контейнере тоже требует времени. \nВ Angular, NestJS и других фреймворках DI может потреблять больше ресурсов, чем обычное создание объектов. \n\n🟠Скрытая сложность и магия \nКогда зависимости внедряются автоматически через контейнер, код становится менее очевидным. \n@Injectable()\nclass Service {\n constructor(private readonly repository: Repository) {}\n}\n\n🟠Проблемы с тестированием \nХотя DI часто называют удобным для тестирования, на практике могут возникнуть сложности: \nЕсли контейнер создаёт объекты динамически, тесты могут работать нестабильно. \nНужно явно мокать зависимости, что может усложнять настройку тестов. \nclass Service {\n constructor(repository) {\n this.repository = repository;\n }\n}\n\nconst service = new Service(new Repository()); // Проблема при тестировании – жестко задана зависимость\n\nЗдесь тестировать Service сложно, потому что Repository создаётся вручную. Приходится использовать мок-объекты\nconst mockRepository = { getData: () =\u003e \"mock data\" };\nconst service = new Service(mockRepository);\n\n🟠DI не всегда нужен \nВ маленьких проектах использование DI может быть излишним. Простое создание объектов может быть проще и понятнее, чем настройка DI-контейнера. \nconst repository = new Repository();\nconst service = new Service(repository);\n\nСтавь 👍 и забирай 📚 Базу знаний"])</script><script>self.__next_f.push([1,"4a:T196c,"])</script><script>self.__next_f.push([1,"{\"_\": \"MessageMediaDocument\", \"nopremium\": false, \"spoiler\": false, \"video\": true, \"round\": false, \"voice\": false, \"document\": {\"_\": \"Document\", \"id\": 5411112997105992821, \"date\": \"2025-10-06T00:04:32+00:00\", \"mime_type\": \"video/mp4\", \"size\": 19961907, \"attributes\": [{\"_\": \"DocumentAttributeVideo\", \"duration\": 10.077, \"w\": 1920, \"h\": 1080, \"round_message\": false, \"supports_streaming\": true, \"nosound\": true, \"video_codec\": \"h264\"}, {\"_\": \"DocumentAttributeFilename\", \"file_name\": \"promo.mp4\"}], \"thumbs\": [{\"_\": \"PhotoStrippedSize\", \"type\": \"i\", \"bytes\": \"ARYo0kHHRc+1Sbhz0/Oo1PT5gfwxVeSNmckITn/axWc5NbDsSRFgoG39cVLvJGNgHvuFUmdd5U7d3cebRvTGdy9Of3maz9pLsFiwWHZlP0NFYloojuoyDnKk0VtYluxvqwxjLH3NS/4elFFUU9yi1lBLJvdSWI5IYinjSrTH3G/77NFFJbCGS2FvboZI0IYd9xNFFFDIluc=\"}]}, \"alt_documents\": [{\"_\": \"Document\", \"id\": 5312212248310090482, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"video/mp4\", \"size\": 4018318, \"attributes\": [{\"_\": \"DocumentAttributeVideo\", \"duration\": 10.077, \"w\": 1920, \"h\": 1080, \"round_message\": false, \"supports_streaming\": true, \"nosound\": false, \"video_codec\": \"av01\"}, {\"_\": \"DocumentAttributeFilename\", \"file_name\": \"promo.mp4\"}], \"thumbs\": [{\"_\": \"PhotoStrippedSize\", \"type\": \"i\", \"bytes\": \"ARYo0kHHRc+xqTcMHp+dRr2+YH8MVXkjZnJVCf8AgWKznJodiSIsFHy/ripd5IxsH13CqTOu8g7d3cebRvXGdy9Of3maz9pLsFiwWHZlP0NFYtoojuoyDnKmitrEtm8pGMZY+5qXHv29KKKoZRaygmk3upLEckMRTxpVrj7jf99miiktgGS2Fvbp5kaEMO+4miiihkM/\"}]}, {\"_\": \"Document\", \"id\": 5312468241245832754, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"application/x-mpegurl\", \"size\": 405, \"attributes\": [{\"_\": \"DocumentAttributeFilename\", \"file_name\": \"mtproto:5312212248310090482\"}]}, {\"_\": \"Document\", \"id\": 5312485515604300202, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"video/mp4\", \"size\": 5972744, \"attributes\": [{\"_\": \"DocumentAttributeVideo\", \"duration\": 10.077, \"w\": 1920, \"h\": 1080, \"round_message\": false, \"supports_streaming\": true, \"nosound\": false, \"video_codec\": \"h264\"}, {\"_\": \"DocumentAttributeFilename\", \"file_name\": \"promo.mp4\"}], \"thumbs\": [{\"_\": \"PhotoStrippedSize\", \"type\": \"i\", \"bytes\": \"ARYo0kHHRc57VJuHPT86jU9PmB/DFV5I2ZyVQnP+1is5yaHYkiLBR8v64qXeSMbB9dwqkzLvKnbu7jzaN64zuX3/AHmaz9pLsFiwWHZlP0OaKxLRRHdIQc5UmitrEtm+pGMZY+5qX/D0ooqhlFrKCV97qSxHJDEU8aXaY+43/fZoopLYBkthbW6eZGhDDvuJooooIkc=\"}]}, {\"_\": \"Document\", \"id\": 5310242391624555953, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"application/x-mpegurl\", \"size\": 405, \"attributes\": [{\"_\": \"DocumentAttributeFilename\", \"file_name\": \"mtproto:5312485515604300202\"}]}, {\"_\": \"Document\", \"id\": 5312306342453610832, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"video/mp4\", \"size\": 1871910, \"attributes\": [{\"_\": \"DocumentAttributeVideo\", \"duration\": 10.077, \"w\": 1280, \"h\": 720, \"round_message\": false, \"supports_streaming\": true, \"nosound\": false, \"video_codec\": \"av01\"}, {\"_\": \"DocumentAttributeFilename\", \"file_name\": \"promo.mp4\"}], \"thumbs\": [{\"_\": \"PhotoStrippedSize\", \"type\": \"i\", \"bytes\": \"ARYo0kHHRc+xqTcMHp+dRr2+YH8MVXkjZnJVCf8AgWKznJodiSIsFHy/ripd5IxsH13CqTOu8g7d3cebRvXGdy9Of3maz9pLsFiwWHZlP0NFYtoojuoyDnKmitrEtm8pGMZY+5qXHv29KKKoZRaygmk3upLEckMRTxpVrj7jf99miiktgGS2Fvbp5kaEMO+4miiihkM/\"}]}, {\"_\": \"Document\", \"id\": 5312544850577493697, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"application/x-mpegurl\", \"size\": 401, \"attributes\": [{\"_\": \"DocumentAttributeFilename\", \"file_name\": \"mtproto:5312306342453610832\"}]}, {\"_\": \"Document\", \"id\": 5312325042741218728, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"video/mp4\", \"size\": 2658154, \"attributes\": [{\"_\": \"DocumentAttributeVideo\", \"duration\": 10.077, \"w\": 1280, \"h\": 720, \"round_message\": false, \"supports_streaming\": true, \"nosound\": false, \"video_codec\": \"h264\"}, {\"_\": \"DocumentAttributeFilename\", \"file_name\": \"promo.mp4\"}], \"thumbs\": [{\"_\": \"PhotoStrippedSize\", \"type\": \"i\", \"bytes\": \"ARYo0kGB0XPsak3DB6fnUanp8wP4YqvJGzOSqE/8CxWc5NDsSRFgoG39cVLvJGNg+u4VSZl3kHbu7jzaN69dy+/7zNZ+0l2CxYLDsyn6GisS0UR3UZBzlSaK2sS2b6kYxlj7mpcfy9KKKoZQazgmfe6ksRyQxFSDSrTH3G/77NFFJbAMlsLe3TzI0IYdDuJooooIZw==\"}]}, {\"_\": \"Document\", \"id\": 5312484669495741545, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"application/x-mpegurl\", \"size\": 404, \"attributes\": [{\"_\": \"DocumentAttributeFilename\", \"file_name\": \"mtproto:5312325042741218728\"}]}, {\"_\": \"Document\", \"id\": 5312026108722446378, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"video/mp4\", \"size\": 806571, \"attributes\": [{\"_\": \"DocumentAttributeVideo\", \"duration\": 10.077, \"w\": 852, \"h\": 480, \"round_message\": false, \"supports_streaming\": true, \"nosound\": false, \"video_codec\": \"av01\"}, {\"_\": \"DocumentAttributeFilename\", \"file_name\": \"promo.mp4\"}], \"thumbs\": [{\"_\": \"PhotoStrippedSize\", \"type\": \"i\", \"bytes\": \"ARYo0kHHRc+xqTcMHp+dRr2+YH8MVXkjZnJVCf8AgWKznJodiSIsFHy/ripd5IxsH13CqTOu8g7d3cebRvXGdy9Of3maz9pLsFiwWHZlP0NFYtoojuoyDnKmitrEtm8pGMZY+5qXHv29KKKoZRaygmk3upLEckMRTxpVrj7jf99miiktgGS2Fvbp5kaEMO+4miiihkM/\"}]}, {\"_\": \"Document\", \"id\": 5312329621176356097, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"application/x-mpegurl\", \"size\": 400, \"attributes\": [{\"_\": \"DocumentAttributeFilename\", \"file_name\": \"mtproto:5312026108722446378\"}]}, {\"_\": \"Document\", \"id\": 5309834215112607703, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"video/mp4\", \"size\": 1100544, \"attributes\": [{\"_\": \"DocumentAttributeVideo\", \"duration\": 10.077, \"w\": 852, \"h\": 480, \"round_message\": false, \"supports_streaming\": true, \"nosound\": false, \"video_codec\": \"h264\"}, {\"_\": \"DocumentAttributeFilename\", \"file_name\": \"promo.mp4\"}], \"thumbs\": [{\"_\": \"PhotoStrippedSize\", \"type\": \"i\", \"bytes\": \"ARYo0kGB0XOexqTcOen51Gp6fMD+GKryRszkqhOf9rFZzk0OxJEWCj5f1xUu8kY2D67hVJnXeQdu7uPNoDrjO5ff95ms/aS7BYsFh2ZT9DRWJaKI7qMg5ypNFbWJbN9SMdWPualx7/pRRVDKDWcE0m91JYjkhiKkGlWuPuN/32aKKS2AZLYW9unmRoQw6HcTRRRQyJbn\"}]}, {\"_\": \"Document\", \"id\": 5312433782723216920, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"application/x-mpegurl\", \"size\": 401, \"attributes\": [{\"_\": \"DocumentAttributeFilename\", \"file_name\": \"mtproto:5309834215112607703\"}]}, {\"_\": \"Document\", \"id\": 5312556528593570490, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"application/x-tgstoryboard\", \"size\": 17978, \"attributes\": [{\"_\": \"DocumentAttributeFilename\", \"file_name\": \"promo.mp4.sb.jpg\"}]}, {\"_\": \"Document\", \"id\": 5312026662773227913, \"date\": \"2025-12-08T11:11:07+00:00\", \"mime_type\": \"application/x-tgstoryboardmap\", \"size\": 103, \"attributes\": [{\"_\": \"DocumentAttributeImageSize\", \"w\": 144, \"h\": 80}, {\"_\": \"DocumentAttributeFilename\", \"file_name\": \"mtproto:5312556528593570490\"}]}]}"])</script><script>self.__next_f.push([1,"4b:T41f,"])</script><script>self.__next_f.push([1,"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAWACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDSQcdFz7VJuHPT86jU9PmB/DFV5I2ZyQhOf9rFZzk1sOxJEWCgbf1xUu8kY2Ae+4VSZ13lTt3dx5tG9MZ3L05/eZrP2kuwWLBYdmU/Q0ViWiiO6jIOcqTRW1iW7G+rDGMsfc1L/h6UUVRT3KLWUEsm91JYjkhiKeNKtMfcb/vs0UUlsIZLYW9uhkjQhh33E0UUUMiW5//Z"])</script><script>self.__next_f.push([1,"4c:T721,"])</script><script>self.__next_f.push([1,"🤔 Для чего скрипт подключают в концe body? \n\nОсновная причина – ускорение загрузки страницы и избежание блокировки рендеринга. \n\nКогда браузер загружает HTML, он читает код сверху вниз. Если в \u003chead\u003e встречается \u003cscript\u003e, браузер останавливает разбор HTML, загружает и выполняет скрипт, а только потом продолжает загружать страницу. \n\n🟠Проблема: блокировка рендеринга \nЕсли скрипт загружается в \u003chead\u003e, он останавливает отрисовку страницы до завершения загрузки. \n\u003chead\u003e\n \u003cscript src=\"script.js\"\u003e\u003c/script\u003e \u003c!-- ❌ Плохо: блокирует рендеринг --\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n \u003ch1\u003eСайт загружается...\u003c/h1\u003e\n\u003c/body\u003e\n\n🟠Решение: подключение в конце `\u003cbody\u003e` \nЕсли разместить \u003cscript\u003e перед закрывающим \u003c/body\u003e, сначала загружается контент страницы, а потом выполняется JavaScript. \n\u003cbody\u003e\n \u003ch1\u003eКонтент загрузился!\u003c/h1\u003e\n \u003cscript src=\"script.js\"\u003e\u003c/script\u003e \u003c!-- Хорошо: не блокирует рендеринг --\u003e\n\u003c/body\u003e\n\n🟠Альтернативы: `defer` и `async` \ndefer – отложенное выполнение после загрузки HTML\n\u003chead\u003e\n \u003cscript src=\"script.js\" defer\u003e\u003c/script\u003e\n\u003c/head\u003e\n\nasync – загрузка и выполнение параллельно \n\u003chead\u003e\n \u003cscript src=\"script.js\" async\u003e\u003c/script\u003e\n\u003c/head\u003e\n\nСтавь 👍 и забирай 📚 Базу знаний"])</script><script>self.__next_f.push([1,"4d:T45f,"])</script><script>self.__next_f.push([1,"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwCBPI8r587/AGpreXjjfn3FMUEnirYnPG7zM4wcY/wppWEVDjtnFAx3q2JuST5n/jtK052nG/Pb7v8AhTApnHbNFKQQeaKAGVeit4Wtd53FiPXpVWNUKFnPPYVLG7lQg6HtSYECIXkC7to9cZqXyGWUxuwU9ie9Rs5hnBxtx3NOnWRmEjZO7o3alcfQJYzFIUJB9x3ophzjmiqAaCMcdamjY8Zfbt6UUUhDnGW8x5AR0BUc1AshHyEkr2oopDJOoyelFFFUgP/Z"])</script><script>self.__next_f.push([1,"4e:T1578,"])</script><script>self.__next_f.push([1,"🤔 Какие используешь подходы для написания приложения которую проще поддерживать, чем делать первоначальную разработку?\n\nПри разработке frontend-приложений, которые в будущем будет проще поддерживать и масштабировать, я придерживаюсь ряда ключевых подходов. \n\n🟠Разделение ответственности (Separation of Concerns)\nЭто значит, что код должен быть разделен по зонам ответственности. В frontend-разработке это проявляется в: \nЧистом разделении логики, представления и данных (например, с помощью архитектуры MVC, MVVM или FLUX). \nИспользовании компонентов в React/Vue или шаблонов в Angular. \nРазделении CSS, JS и HTML, либо использовании методологий, где стили хранятся рядом с компонентом (CSS Modules, Styled Components). \nВместо того, чтобы писать всю логику и разметку в одном файле: \nfunction App() {\n const [count, setCount] = useState(0);\n return \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003eCount: {count}\u003c/button\u003e;\n}\n \n\nЯ разделяю бизнес-логику и представление\n// CounterLogic.js\nexport function useCounter() {\n const [count, setCount] = useState(0);\n const increment = () =\u003e setCount(count + 1);\n return { count, increment };\n}\n\n// Counter.js\nimport { useCounter } from \"./CounterLogic\";\nfunction Counter() {\n const { count, increment } = useCounter();\n return \u003cbutton onClick={increment}\u003eCount: {count}\u003c/button\u003e;\n}\n \n\n🟠Компонентный подход и повторное использование кода\nFrontend-приложения должны строиться из переиспользуемых и изолированных компонентов. Это уменьшает дублирование кода и делает его понятным. \n// Button.js (переиспользуемый компонент)\nfunction Button({ onClick, children }) {\n return \u003cbutton onClick={onClick}\u003e{children}\u003c/button\u003e;\n}\n\n// Counter.js (использует Button)\nfunction Counter() {\n const [count, setCount] = useState(0);\n return \u003cButton onClick={() =\u003e setCount(count + 1)}\u003eCount: {count}\u003c/Button\u003e;\n}\n \n\n🟠Чистый код и читаемость\nКод должен быть понятным не только мне, но и другим разработчикам. \nПонятные имена переменных и функций. Вместо x → userAge, вместо doSmth() → calculateTotalPrice(). \nМеньше вложенности. Вместо кучи if и else, лучше использовать early return. \nРазбиение кода на модули. Один файл = одна зона ответственности. \nfunction getDiscountedPrice(price, discount) {\n if (discount \u003c= 0) return price;\n return price - price * (discount / 100);\n}\n \n\n🟠Состояние приложения: локальное vs глобальное\nВ зависимости от сложности приложения нужно правильно управлять состоянием: \nЛокальное состояние – useState (React), ref (Vue) для простых данных внутри компонента. \nГлобальное состояние – Redux, MobX, Zustand, Pinia, Context API – когда данные нужны многим компонентам. \nСерверное состояние – React Query, SWR – когда данные приходят с API и их нужно кешировать. \n\n🟠Следование принципам SOLID и DRY\nDRY (Don't Repeat Yourself) – не повторяем код, используем функции, хуки, компоненты. \nSOLID – например, принцип единственной ответственности (Single Responsibility Principle) гласит, что каждый компонент или функция должны решать только одну задачу. \nfunction sendEmailAndSaveToDB(user) {\n sendEmail(user.email);\n saveUserToDatabase(user);\n}\n\nЛучше разделить логику\nfunction sendEmail(email) { /* отправка письма */ }\nfunction saveUserToDatabase(user) { /* сохранение в БД */ }\nfunction registerUser(user) {\n sendEmail(user.email);\n saveUserToDatabase(user);\n}\n\n🟠Использование TypeScript\nTypeScript помогает избежать ошибок и делать код предсказуемым. \ntype User = {\n id: number;\n name: string;\n};\n\nfunction getUserName(user: User): string {\n return user.name;\n}\n \n\n🟠Документация и кодстайл\nESLint + Prettier → автоформатирование и проверка стиля. \nJSDoc/TypeScript → документация функций и типов данных. \nStorybook → для документирования UI-компонентов.\n\nСтавь 👍 и забирай 📚 Базу знаний"])</script><script>self.__next_f.push([1,"4f:T7a8,"])</script><script>self.__next_f.push([1,"🤔 В чем различие методов call apply bind? \n\nМетоды call, apply и bind принадлежат к функциональному объекту Function и используются для указания контекста this при вызове функции. Хотя все три метода позволяют контролировать значение this внутри функции, между ними существуют ключевые различия в способе использования и поведении.\n\n🚩Сall\n\nВызывает функцию, явно устанавливая this в первом аргументе. Остальные аргументы передаются в вызываемую функцию как есть.\nfunction greet(message, name) {\n console.log(${message}, ${name}. This is ${this});\n}\n\ngreet.call(\"Earth\", \"Hello\", \"Alice\"); // \"Hello, Alice. This is Earth\"\n\n🚩Apply\n\nОчень похож на call, но принимает аргументы в виде массива, а не по отдельности.\nfunction greet(message, name) {\n console.log(\n${message}, ${name}. This is ${this}\n);\n}\n\ngreet.apply(\"Earth\", [\"Hello\", \"Alice\"]); // \"Hello, Alice. This is Earth\"\n\n🚩Bind\n\nСоздаёт новую функцию, которая, когда она вызывается, имеет установленный контекст this, указанный в первом аргументе. В отличие от call и apply, bind не вызывает функцию сразу, а возвращает новую функцию, которую можно вызвать позже.\nfunction greet(message, name) {\n console.log(\n${message}, ${name}. This is ${this}\n);\n}\n\nconst greetEarth = greet.bind(\"Earth\", \"Hello\", \"Alice\");\ngreetEarth(); // \"Hello, Alice. This is Earth\"\n\nСтавь 👍 и забирай 📚 Базу знаний"])</script><script>self.__next_f.push([1,"50:T447,"])</script><script>self.__next_f.push([1,"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwCFUyuc0vle9NVWPQZpdj+lZAK0RUgAgk+lPFuccnBp9pHmQlh0HFSNwTkgYPerSXUVrlR4yh56UVYuCpRgOwz+tFTJK+gWZXTG05A/E0b1/uCmjHeg47VIFuyw0j8AfLTJn+dlJ6H0os3CM+TgleKrzNuck5JrRbDJW/j9Ng6fUUVCkmC4P8S4H5g0UnqAoJHfFLkkYzxRRUCG9wQcEHNGPU5oop30GNEYBzknFFFFK4H/2Q=="])</script><script>self.__next_f.push([1,"51:Tfe6,"])</script><script>self.__next_f.push([1,"🤔 Как растянуть элемент на 100%?\n\nЧтобы растянуть элемент на 100% (по ширине, высоте или обоим направлениям), нужно понимать контекст, от чего \"100%\" будет вычисляться. Значение 100% в CSS основывается на родительском элементе. Рассмотрим различные случаи и подходы.\n\n🟠Растяжение элемента на 100% ширины (`width: 100%;`)\nЭлемент займет всю ширину своего родителя.\n\u003cdiv style=\"width: 300px; background: lightblue;\"\u003e\n \u003cdiv style=\"width: 100%; background: coral;\"\u003eЯ растянут по ширине!\u003c/div\u003e\n\u003c/div\u003e\n\n🟠Растяжение элемента на 100% высоты (`height: 100%;`)\nЭлемент займет всю высоту родительского элемента.\n\u003cdiv style=\"height: 300px; background: lightblue;\"\u003e\n \u003cdiv style=\"height: 100%; background: coral;\"\u003eЯ растянут по высоте!\u003c/div\u003e\n\u003c/div\u003e\n\n🟠Растяжение элемента на 100% ширины и высоты\nДля растяжения элемента как по ширине, так и по высоте относительно родителя используются width: 100%; и height: 100%;.\n\u003cdiv style=\"width: 300px; height: 300px; background: lightblue;\"\u003e\n \u003cdiv style=\"width: 100%; height: 100%; background: coral;\"\u003eРастянут по ширине и высоте!\u003c/div\u003e\n\u003c/div\u003e\n\n🟠Растяжение относительно окна браузера (`viewport`)\nЕсли элемент нужно растянуть на весь экран, используются единицы 100vw (ширина окна) и 100vh (высота окна).\n\u003cdiv style=\"width: 100vw; height: 100vh; background: coral;\"\u003e\n Я растянут на весь экран!\n\u003c/div\u003e\n\nДля исключения полосы прокрутки можно использовать\nwidth: calc(100vw - 16px); /* Учитывается ширина скролла */\n\n🟠Использование `position: absolute`\nКогда нужно растянуть элемент независимо от размера его содержимого, можно использовать position: absolute.\n\u003cdiv style=\"position: relative; width: 300px; height: 300px; background: lightblue;\"\u003e\n \u003cdiv style=\"position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: coral;\"\u003e\n Я растянут абсолютно!\n \u003c/div\u003e\n\u003c/div\u003e\n\n🟠Растяжение внутри Flexbox-контейнера\nFlexbox автоматически растягивает вложенные элементы, если у них указаны свойства flex: 1 или align-items: stretch.\n\u003cdiv style=\"display: flex; width: 300px; height: 300px; background: lightblue;\"\u003e\n \u003cdiv style=\"flex: 1; background: coral;\"\u003eЯ растянут по Flexbox!\u003c/div\u003e\n\u003c/div\u003e\n\n🟠Растяжение внутри Grid-контейнера\nCSS Grid также позволяет растягивать элементы.\n\u003cdiv style=\"display: grid; width: 300px; height: 300px; background: lightblue;\"\u003e\n \u003cdiv style=\"width: 100%; height: 100%; background: coral;\"\u003eЯ растянут внутри Grid!\u003c/div\u003e\n\u003c/div\u003e\n\n🟠Растяжение с учетом отступов\nЕсли нужно учесть отступы (padding) или границы (border), используйте свойство box-sizing: border-box. Это гарантирует, что элемент с width: 100% и height: 100% не будет \"выходить за пределы\" из-за отступов.\n\u003cdiv style=\"width: 300px; height: 300px; background: lightblue;\"\u003e\n \u003cdiv style=\"width: 100%; height: 100%; padding: 20px; box-sizing: border-box; background: coral;\"\u003e\n Я растянут с учетом отступов!\n \u003c/div\u003e\n\u003c/div\u003e\n\nСтавь 👍 и забирай 📚 Базу знаний"])</script><script>self.__next_f.push([1,"42:[\"$\",\"$L43\",null,{\"channelId\":\"1917151177\",\"postsInitialData\":{\"messages\":[{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2206,\"publishDate\":\"2025-12-11T09:05:41Z\",\"message\":\"$44\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityUnderline\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":26},{\"kind\":\"MessageEntityUnderline\",\"offset\":2,\"length\":26},{\"kind\":\"MessageEntityCode\",\"offset\":30,\"length\":10},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":235,\"length\":2,\"documentId\":\"5390810192776540374\"},{\"kind\":\"MessageEntityBold\",\"offset\":237,\"length\":27},{\"kind\":\"MessageEntityCode\",\"offset\":574,\"length\":10},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":800,\"length\":2,\"documentId\":\"5390810192776540374\"},{\"kind\":\"MessageEntityBold\",\"offset\":802,\"length\":31},{\"kind\":\"MessageEntityCode\",\"offset\":836,\"length\":10},{\"kind\":\"MessageEntityPre\",\"offset\":929,\"length\":268,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1199,\"length\":2,\"documentId\":\"5390810192776540374\"},{\"kind\":\"MessageEntityCode\",\"offset\":1212,\"length\":10},{\"kind\":\"MessageEntityCode\",\"offset\":1229,\"length\":10},{\"kind\":\"MessageEntityPre\",\"offset\":1332,\"length\":335,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1669,\"length\":2,\"documentId\":\"5390810192776540374\"},{\"kind\":\"MessageEntityBold\",\"offset\":1671,\"length\":41},{\"kind\":\"MessageEntityCode\",\"offset\":1786,\"length\":4},{\"kind\":\"MessageEntityBold\",\"offset\":1999,\"length\":6},{\"kind\":\"MessageEntityTextUrl\",\"offset\":2005,\"length\":2,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":2005,\"length\":2},{\"kind\":\"MessageEntityBold\",\"offset\":2007,\"length\":11},{\"kind\":\"MessageEntityTextUrl\",\"offset\":2018,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":2018,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":2021,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":2021,\"length\":11}],\"meta\":{\"views\":1884,\"forwardsCount\":13,\"commentsCount\":0,\"reactionsCount\":8,\"publishDate\":\"2025-12-11T09:05:41Z\",\"deletedAt\":null,\"reactions\":[{\"count\":6,\"emoticon\":\"👍\"},{\"count\":2,\"emoticon\":\"💊\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2205,\"publishDate\":\"2025-12-11T02:17:40Z\",\"message\":\"Бизнес 2026 — готовьтесь заранее\\n\\nМасштабная конференция про главные изменения для бизнеса в 2026 г.\\n\\nНалоговая реформа, продажи, прибыль, команда и партнёрство: практические идеи от экспертов Битрикс24, Точка Банк, Bidzaar и Smartway. \\n\\nУчаствуйте бесплатно — узнайте, что важно уже сейчас ✅ \\n\\nЗарегистрироваться\\n\\n#реклама 16+\\nbusiness2026.ru\\nО рекламодателе\",\"mediaRaw\":\"{\\\"_\\\": \\\"MessageMediaDocument\\\", \\\"nopremium\\\": false, \\\"spoiler\\\": false, \\\"video\\\": false, \\\"round\\\": false, \\\"voice\\\": false, \\\"document\\\": {\\\"_\\\": \\\"Document\\\", \\\"id\\\": 5319270060693430114, \\\"date\\\": \\\"2025-12-11T02:17:40+00:00\\\", \\\"mime_type\\\": \\\"video/mp4\\\", \\\"size\\\": 4426993, \\\"attributes\\\": [{\\\"_\\\": \\\"DocumentAttributeVideo\\\", \\\"duration\\\": 10.0, \\\"w\\\": 640, \\\"h\\\": 640, \\\"round_message\\\": false, \\\"supports_streaming\\\": true, \\\"nosound\\\": true, \\\"video_codec\\\": \\\"h264\\\"}, {\\\"_\\\": \\\"DocumentAttributeAnimated\\\"}, {\\\"_\\\": \\\"DocumentAttributeFilename\\\", \\\"file_name\\\": \\\"tmpwjix7wyi.mp4\\\"}], \\\"thumbs\\\": [{\\\"_\\\": \\\"PhotoStrippedSize\\\", \\\"type\\\": \\\"i\\\", \\\"bytes\\\": \\\"ASgo2aKKKACikJphfFA7EmaKh8zOfainYRNSGlprHFIBjtiqsklSyEnsarmN3PQ49atIcZImikVxj+IUVD9nwfvNn2FFVZCckaLKrDDAH61DIijoqj8KKKzjuTLYrtgdAB+FMSQKSGUYPtRRW6SaMOZkrLuT92dn06Giiip20Ktc\\\"}]}}\",\"entities\":[{\"kind\":\"MessageEntityTextUrl\",\"offset\":0,\"length\":32,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FNyi216er8DdRnM%2F%3Ferid%3Dj1SUmAVmvi49iZugd\"},{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":32},{\"kind\":\"MessageEntityTextUrl\",\"offset\":295,\"length\":18,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FYtn7DTaW8DdRnT%2F%3Ferid%3Dj1SUmAVmvi49iZugd\"},{\"kind\":\"MessageEntityBold\",\"offset\":295,\"length\":18},{\"kind\":\"MessageEntityHashtag\",\"offset\":315,\"length\":8},{\"kind\":\"MessageEntityTextUrl\",\"offset\":327,\"length\":16,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FNyi216er8DdRnM%2F%3Ferid%3Dj1SUmAVmvi49iZugd\"},{\"kind\":\"MessageEntityTextUrl\",\"offset\":344,\"length\":15,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FPE2b0xvB8DdRnQ%2F%3Ferid%3Dj1SUmAVmvi49iZugd\"}],\"meta\":{\"views\":1163,\"forwardsCount\":0,\"commentsCount\":0,\"reactionsCount\":0,\"publishDate\":\"2025-12-11T02:17:40Z\",\"deletedAt\":\"2025-12-13T00:39:49Z\",\"reactions\":[],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":{\"width\":640,\"height\":640,\"size\":4426993,\"durationSeconds\":10,\"url\":\"\",\"thumbUrl\":\"\",\"filename\":\"tmpwjix7wyi.mp4\",\"thumbBase64\":\"$45\",\"lazyUrl\":\"https://n3.tlmtr.cc/lazy/5319270060693430114\"}},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2204,\"publishDate\":\"2025-12-10T16:10:41Z\",\"message\":\"🤔 Что такое прогрессивный рендеринг?\\n\\nЭто подход, при котором контент страницы отрисовывается по мере загрузки, а не дожидаясь полной загрузки всех ресурсов. Улучшает скорость восприятия и пользовательский опыт.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":35},{\"kind\":\"MessageEntitySpoiler\",\"offset\":38,\"length\":174},{\"kind\":\"MessageEntityTextUrl\",\"offset\":260,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":260,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":263,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":263,\"length\":11}],\"meta\":{\"views\":1979,\"forwardsCount\":5,\"commentsCount\":0,\"reactionsCount\":9,\"publishDate\":\"2025-12-10T16:10:41Z\",\"deletedAt\":null,\"reactions\":[{\"count\":9,\"emoticon\":\"🔥\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2203,\"publishDate\":\"2025-12-10T09:05:40Z\",\"message\":\"$46\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityUnderline\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":58},{\"kind\":\"MessageEntityUnderline\",\"offset\":2,\"length\":58},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":269,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":271,\"length\":29},{\"kind\":\"MessageEntityPre\",\"offset\":378,\"length\":327,\"language\":\"jsx\"},{\"kind\":\"MessageEntityPre\",\"offset\":757,\"length\":166,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":925,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":927,\"length\":65},{\"kind\":\"MessageEntityCode\",\"offset\":1063,\"length\":17},{\"kind\":\"MessageEntityCode\",\"offset\":1082,\"length\":18},{\"kind\":\"MessageEntityCode\",\"offset\":1102,\"length\":20},{\"kind\":\"MessageEntityPre\",\"offset\":1127,\"length\":378,\"language\":\"jsx\"},{\"kind\":\"MessageEntityPre\",\"offset\":1558,\"length\":232,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1792,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":1794,\"length\":53},{\"kind\":\"MessageEntityCode\",\"offset\":1969,\"length\":4},{\"kind\":\"MessageEntityCode\",\"offset\":1989,\"length\":8},{\"kind\":\"MessageEntityCode\",\"offset\":2045,\"length\":4},{\"kind\":\"MessageEntityPre\",\"offset\":2118,\"length\":364,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":2484,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":2486,\"length\":63},{\"kind\":\"MessageEntityPre\",\"offset\":2645,\"length\":235,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCode\",\"offset\":2888,\"length\":9},{\"kind\":\"MessageEntityPre\",\"offset\":2917,\"length\":157,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":3076,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":3078,\"length\":41},{\"kind\":\"MessageEntityBold\",\"offset\":3446,\"length\":6},{\"kind\":\"MessageEntityTextUrl\",\"offset\":3452,\"length\":2,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":3452,\"length\":2},{\"kind\":\"MessageEntityBold\",\"offset\":3454,\"length\":11},{\"kind\":\"MessageEntityTextUrl\",\"offset\":3465,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":3465,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":3468,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":3468,\"length\":11}],\"meta\":{\"views\":2149,\"forwardsCount\":15,\"commentsCount\":0,\"reactionsCount\":8,\"publishDate\":\"2025-12-10T09:05:40Z\",\"deletedAt\":null,\"reactions\":[{\"count\":8,\"emoticon\":\"👍\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2202,\"publishDate\":\"2025-12-09T20:12:58Z\",\"message\":\"Где вести задачи и проекты? Конечно, в Битрикс24\\n\\nБесплатный онлайн-сервис для бизнеса и совместной работы. Полный комплект для работы без хаоса.\\nСтавьте первую задачу прямо сейчас \\n\\nНачать\\n\\n#реклама 16+\\ntask-24.bitrix24.ru\\nО рекламодателе\",\"mediaRaw\":\"{\\\"_\\\": \\\"MessageMediaPhoto\\\", \\\"spoiler\\\": false, \\\"photo\\\": {\\\"_\\\": \\\"Photo\\\", \\\"id\\\": 5314397661274247552, \\\"date\\\": \\\"2025-12-09T20:12:58+00:00\\\", \\\"sizes\\\": [{\\\"_\\\": \\\"PhotoStrippedSize\\\", \\\"type\\\": \\\"i\\\", \\\"bytes\\\": \\\"ASgohto1e5CyD5ec5PtWillbMeAD9GNU1+Vww6jNWBNI52q2wlu3Yda6KspLVERS2ZVuUWG5ZFGAMfyoFuv3lOO+KkkjMly6uSTjkkcVCXMbFSScHGM0o1b2QnTtdltVVlyRk9CaKihkycUVbTRncbTR5wk3RjOKfS7hnpj8aco8yszoasNzOSCU5+pqAwSGTc4AP1q3uX1/nTdw9M/jUKmk7kSbtYI120UmaK0aMhcUqOUzjHNFFDipKzOySF85vb9aa7l8ZxxRRUKlCLukYsb+NFFFaGTR\\\"}, {\\\"_\\\": \\\"PhotoSizeProgressive\\\", \\\"type\\\": \\\"y\\\", \\\"w\\\": 1080, \\\"h\\\": 1073, \\\"sizes\\\": [16133, 37505, 63796, 85511, 148422]}], \\\"has_stickers\\\": false}}\",\"entities\":[{\"kind\":\"MessageEntityTextUrl\",\"offset\":0,\"length\":48,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FGqFSTgn58D5Q5h%2F%3Ferid%3Dj1SUmVqo6zngvLRZK\"},{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":48},{\"kind\":\"MessageEntityBold\",\"offset\":146,\"length\":34},{\"kind\":\"MessageEntityTextUrl\",\"offset\":183,\"length\":6,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FjHVmRfOo8D5Q5w%2F%3Ferid%3Dj1SUmVqo6zngvLRZK\"},{\"kind\":\"MessageEntityBold\",\"offset\":183,\"length\":6},{\"kind\":\"MessageEntityHashtag\",\"offset\":191,\"length\":8},{\"kind\":\"MessageEntityTextUrl\",\"offset\":203,\"length\":20,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FGqFSTgn58D5Q5h%2F%3Ferid%3Dj1SUmVqo6zngvLRZK\"},{\"kind\":\"MessageEntityTextUrl\",\"offset\":224,\"length\":15,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FZmWIsuy_8D5Q5o%2F%3Ferid%3Dj1SUmVqo6zngvLRZK\"}],\"meta\":{\"views\":1443,\"forwardsCount\":0,\"commentsCount\":0,\"reactionsCount\":2,\"publishDate\":\"2025-12-09T20:12:58Z\",\"deletedAt\":\"2025-12-15T13:49:40Z\",\"reactions\":[{\"count\":2,\"emoticon\":\"💊\"}],\"isAd\":false},\"album\":[],\"photo\":{\"width\":1080,\"height\":1073,\"size\":148422,\"url\":\"\",\"thumbUrl\":\"\",\"thumbBase64\":\"$47\",\"lazyUrl\":\"https://n1.tlmtr.cc/lazy/5314397661274247552\"},\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2201,\"publishDate\":\"2025-12-09T16:10:39Z\",\"message\":\"🤔 Является ли Web Workers частью спецификации HTML5?\\n\\nДа, Web Workers — часть HTML5. Это механизм для многопоточности в браузере: выполнение кода в фоновом потоке, без блокировки UI.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":51},{\"kind\":\"MessageEntitySpoiler\",\"offset\":54,\"length\":129},{\"kind\":\"MessageEntityTextUrl\",\"offset\":231,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":231,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":234,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":234,\"length\":11}],\"meta\":{\"views\":2146,\"forwardsCount\":5,\"commentsCount\":0,\"reactionsCount\":11,\"publishDate\":\"2025-12-09T16:10:39Z\",\"deletedAt\":null,\"reactions\":[{\"count\":8,\"emoticon\":\"🔥\"},{\"count\":2,\"emoticon\":\"👍\"},{\"count\":1,\"emoticon\":\"💊\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2200,\"publishDate\":\"2025-12-09T11:20:35Z\",\"message\":\"В бигтехе есть место не только для разработчиков\\n\\nВ VK ценят каждого специалиста — от маркетологов до HR. По ссылке — истории сотрудников, которые меняют продукты компании без единой строчки кода. Смотрите ролики и вакансии, где вы точно сможете проявить себя. \\n\\nПерейти на сайт\\n\\n#реклама 16+\\nvkteam.ru\\nО рекламодателе\",\"mediaRaw\":\"{\\\"_\\\": \\\"MessageMediaDocument\\\", \\\"nopremium\\\": false, \\\"spoiler\\\": false, \\\"video\\\": false, \\\"round\\\": false, \\\"voice\\\": false, \\\"document\\\": {\\\"_\\\": \\\"Document\\\", \\\"id\\\": 5314397660814283089, \\\"date\\\": \\\"2025-12-09T11:20:34+00:00\\\", \\\"mime_type\\\": \\\"video/mp4\\\", \\\"size\\\": 9881026, \\\"attributes\\\": [{\\\"_\\\": \\\"DocumentAttributeVideo\\\", \\\"duration\\\": 10.0, \\\"w\\\": 1920, \\\"h\\\": 1080, \\\"round_message\\\": false, \\\"supports_streaming\\\": true, \\\"nosound\\\": true, \\\"video_codec\\\": \\\"h264\\\"}, {\\\"_\\\": \\\"DocumentAttributeAnimated\\\"}, {\\\"_\\\": \\\"DocumentAttributeFilename\\\", \\\"file_name\\\": \\\"tmpt6xrteqa.mp4\\\"}], \\\"thumbs\\\": [{\\\"_\\\": \\\"PhotoStrippedSize\\\", \\\"type\\\": \\\"i\\\", \\\"bytes\\\": \\\"ARYovo2zJaQvntiottRztjIyAB14zUJ811IjMh4+U4xW0VpcjlcnYs7ajmbaMDGSO9VEhnGdyzv6ZOP60j2s79EkH1b/AOvU8zBQSepYTexVVbpy2RRVmKEooySWxzzRVXJZM0SMDuUEH1pphGRjgDsKKKy8iyP7MMdcdulSpCEOc80UUDH7aKKKBH8=\\\"}]}}\",\"entities\":[{\"kind\":\"MessageEntityTextUrl\",\"offset\":0,\"length\":48,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FJaOQ9Xkg8CoS3S%2F%3Ferid%3Dj1SUmBEoGeyrNhKuT\"},{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":48},{\"kind\":\"MessageEntityTextUrl\",\"offset\":263,\"length\":15,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FdsZAFs1t8CoS4W%2F%3Ferid%3Dj1SUmBEoGeyrNhKuT\"},{\"kind\":\"MessageEntityBold\",\"offset\":263,\"length\":15},{\"kind\":\"MessageEntityHashtag\",\"offset\":280,\"length\":8},{\"kind\":\"MessageEntityTextUrl\",\"offset\":292,\"length\":10,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FJaOQ9Xkg8CoS3S%2F%3Ferid%3Dj1SUmBEoGeyrNhKuT\"},{\"kind\":\"MessageEntityTextUrl\",\"offset\":303,\"length\":15,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2Fa3nKsnDS8CoS3n%2F%3Ferid%3Dj1SUmBEoGeyrNhKuT\"}],\"meta\":{\"views\":1630,\"forwardsCount\":0,\"commentsCount\":0,\"reactionsCount\":0,\"publishDate\":\"2025-12-09T11:20:35Z\",\"deletedAt\":\"2025-12-11T09:26:42Z\",\"reactions\":[],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":{\"width\":1920,\"height\":1080,\"size\":9881026,\"durationSeconds\":10,\"url\":\"\",\"thumbUrl\":\"\",\"filename\":\"tmpt6xrteqa.mp4\",\"thumbBase64\":\"$48\",\"lazyUrl\":\"https://n3.tlmtr.cc/lazy/5314397660814283089\"}},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2199,\"publishDate\":\"2025-12-09T09:05:40Z\",\"message\":\"$49\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityUnderline\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":26},{\"kind\":\"MessageEntityUnderline\",\"offset\":2,\"length\":26},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":160,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":162,\"length\":29},{\"kind\":\"MessageEntityPre\",\"offset\":337,\"length\":83,\"language\":\"js\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":422,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":424,\"length\":49},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":822,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":824,\"length\":25},{\"kind\":\"MessageEntityPre\",\"offset\":946,\"length\":89,\"language\":\"ts\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1037,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":1039,\"length\":24},{\"kind\":\"MessageEntityPre\",\"offset\":1308,\"length\":188,\"language\":\"js\"},{\"kind\":\"MessageEntityCode\",\"offset\":1516,\"length\":7},{\"kind\":\"MessageEntityCode\",\"offset\":1543,\"length\":10},{\"kind\":\"MessageEntityPre\",\"offset\":1609,\"length\":99,\"language\":\"js\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1710,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":1712,\"length\":18},{\"kind\":\"MessageEntityPre\",\"offset\":1878,\"length\":77,\"language\":\"js\"},{\"kind\":\"MessageEntityBold\",\"offset\":1957,\"length\":6},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1963,\"length\":2,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":1963,\"length\":2},{\"kind\":\"MessageEntityBold\",\"offset\":1965,\"length\":11},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1976,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":1976,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1979,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":1979,\"length\":11}],\"meta\":{\"views\":2372,\"forwardsCount\":14,\"commentsCount\":0,\"reactionsCount\":6,\"publishDate\":\"2025-12-09T09:05:40Z\",\"deletedAt\":null,\"reactions\":[{\"count\":3,\"emoticon\":\"💊\"},{\"count\":2,\"emoticon\":\"🔥\"},{\"count\":1,\"emoticon\":\"👍\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2198,\"publishDate\":\"2025-12-08T16:10:39Z\",\"message\":\"🤔 Что известно про memo в React?\\n\\nReact.memo — это HOC (Higher-Order Component), который позволяет избежать лишнего рендера, если пропсы не изменились.\\nReact.memo сравнивает предыдущие и новые пропсы (shallow comparison) и перерисовывает компонент только при их изменении. Можно передать кастомную функцию сравнения как второй аргумент для тонкой настройки.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":31},{\"kind\":\"MessageEntitySpoiler\",\"offset\":34,\"length\":324},{\"kind\":\"MessageEntityTextUrl\",\"offset\":406,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":406,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":409,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":409,\"length\":11}],\"meta\":{\"views\":2168,\"forwardsCount\":11,\"commentsCount\":0,\"reactionsCount\":12,\"publishDate\":\"2025-12-08T16:10:39Z\",\"deletedAt\":null,\"reactions\":[{\"count\":9,\"emoticon\":\"🔥\"},{\"count\":3,\"emoticon\":\"👍\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2197,\"publishDate\":\"2025-12-08T11:12:03Z\",\"message\":\"📺 База 1000+ реальных собеседований\\n\\nНа программиста, тестировщика, аналитика, проджекта и другие IT профы. \\n\\nЕсть собесы от ведущих компаний: Сбер, Яндекс, ВТБ, Тинькофф, Озон, Wildberries и т.д.\\n\\n🎯 Переходи по ссылке и присоединяйся к базе, чтобы прокачать свои шансы на успешное трудоустройство!\",\"mediaRaw\":\"$4a\",\"entities\":[{\"kind\":\"MessageEntityUnderline\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5294340837851802907\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":36},{\"kind\":\"MessageEntityUnderline\",\"offset\":111,\"length\":32},{\"kind\":\"MessageEntityTextUrl\",\"offset\":202,\"length\":42,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2F%2BOERl3d0TUkpiN2Uy\"}],\"meta\":{\"views\":2306,\"forwardsCount\":4,\"commentsCount\":0,\"reactionsCount\":0,\"publishDate\":\"2025-12-08T11:12:03Z\",\"deletedAt\":null,\"reactions\":[],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":{\"width\":1920,\"height\":1080,\"size\":19961907,\"durationSeconds\":10.077,\"url\":\"\",\"thumbUrl\":\"\",\"filename\":\"promo.mp4\",\"thumbBase64\":\"$4b\",\"lazyUrl\":\"https://n2.tlmtr.cc/lazy/5411112997105992821\"}},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2196,\"publishDate\":\"2025-12-08T09:05:40Z\",\"message\":\"$4c\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityUnderline\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":41},{\"kind\":\"MessageEntityUnderline\",\"offset\":2,\"length\":41},{\"kind\":\"MessageEntityCode\",\"offset\":196,\"length\":6},{\"kind\":\"MessageEntityCode\",\"offset\":215,\"length\":8},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":339,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":341,\"length\":31},{\"kind\":\"MessageEntityCode\",\"offset\":400,\"length\":6},{\"kind\":\"MessageEntityPre\",\"offset\":470,\"length\":134,\"language\":\"html\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":606,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":608,\"length\":37},{\"kind\":\"MessageEntityCode\",\"offset\":663,\"length\":8},{\"kind\":\"MessageEntityCode\",\"offset\":690,\"length\":7},{\"kind\":\"MessageEntityPre\",\"offset\":771,\"length\":121,\"language\":\"html\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":894,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":896,\"length\":31},{\"kind\":\"MessageEntityCode\",\"offset\":930,\"length\":5},{\"kind\":\"MessageEntityPre\",\"offset\":980,\"length\":56,\"language\":\"html\"},{\"kind\":\"MessageEntityCode\",\"offset\":1038,\"length\":5},{\"kind\":\"MessageEntityPre\",\"offset\":1082,\"length\":56,\"language\":\"html\"},{\"kind\":\"MessageEntityBold\",\"offset\":1140,\"length\":6},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1146,\"length\":2,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":1146,\"length\":2},{\"kind\":\"MessageEntityBold\",\"offset\":1148,\"length\":11},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1159,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":1159,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1162,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":1162,\"length\":11}],\"meta\":{\"views\":2183,\"forwardsCount\":17,\"commentsCount\":0,\"reactionsCount\":8,\"publishDate\":\"2025-12-08T09:05:40Z\",\"deletedAt\":null,\"reactions\":[{\"count\":8,\"emoticon\":\"👍\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2195,\"publishDate\":\"2025-12-07T23:50:00Z\",\"message\":\"Тютю-гребень или капикрыса?\\n\\nПобалуйте себя роскошью от Ричарда Сапогова или утепляйтесь с культовой рубашкой Инженера. Выбирайте фаворитов из коллекции с персонажами Антона Лапенко. \\n\\nПерейти на сайт\\n\\n#реклама \\ntbank.ru\\nО рекламодателе\",\"mediaRaw\":\"{\\\"_\\\": \\\"MessageMediaPhoto\\\", \\\"spoiler\\\": false, \\\"photo\\\": {\\\"_\\\": \\\"Photo\\\", \\\"id\\\": 5310269325824429019, \\\"date\\\": \\\"2025-12-07T23:50:00+00:00\\\", \\\"sizes\\\": [{\\\"_\\\": \\\"PhotoStrippedSize\\\", \\\"type\\\": \\\"i\\\", \\\"bytes\\\": \\\"ASgogTyPK+fO/wBqa3l44359xTFBJ4q2Jzxu8zOMHGP8KaVhFQ47ZxQMd6tibkk+Z/47StOdpxvz2+7/AIUwKZx2zRSkEHmigBlXoreFrXedxYj16VVjVChZzz2FSxu5UIOh7UmBAiF5Au7aPXGal8hllMbsFPYnvUbOYZwcbcdzTp1kZhI2Tu6N2pXH0CWMxSFCQfcd6KYc45oqgGgjHHWpo2PGX27elFFIQ5xlvMeQEdAVHNQLIR8hJK9qKKQyTqMnpRRRVIA=\\\"}, {\\\"_\\\": \\\"PhotoSizeProgressive\\\", \\\"type\\\": \\\"y\\\", \\\"w\\\": 1200, \\\"h\\\": 1200, \\\"sizes\\\": [16898, 39814, 65736, 91086, 147922]}], \\\"has_stickers\\\": false}}\",\"entities\":[{\"kind\":\"MessageEntityTextUrl\",\"offset\":0,\"length\":27,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FHslyz_Or8C7apR%2F%3Ferid%3Dj1SUnWrBzHHjhUyZ3\"},{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":27},{\"kind\":\"MessageEntityTextUrl\",\"offset\":185,\"length\":15,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FqDHG8R9i8C7aqv%2F%3Ferid%3Dj1SUnWrBzHHjhUyZ3\"},{\"kind\":\"MessageEntityBold\",\"offset\":185,\"length\":15},{\"kind\":\"MessageEntityHashtag\",\"offset\":202,\"length\":8},{\"kind\":\"MessageEntityTextUrl\",\"offset\":211,\"length\":9,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FHslyz_Or8C7apR%2F%3Ferid%3Dj1SUnWrBzHHjhUyZ3\"},{\"kind\":\"MessageEntityTextUrl\",\"offset\":221,\"length\":15,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FVRKg5F8a8C7aqn%2F%3Ferid%3Dj1SUnWrBzHHjhUyZ3\"}],\"meta\":{\"views\":1517,\"forwardsCount\":0,\"commentsCount\":0,\"reactionsCount\":2,\"publishDate\":\"2025-12-07T23:50:00Z\",\"deletedAt\":\"2025-12-09T21:50:06Z\",\"reactions\":[{\"count\":2,\"emoticon\":\"💊\"}],\"isAd\":false},\"album\":[],\"photo\":{\"width\":1200,\"height\":1200,\"size\":147922,\"url\":\"\",\"thumbUrl\":\"\",\"thumbBase64\":\"$4d\",\"lazyUrl\":\"https://n1.tlmtr.cc/lazy/5310269325824429019\"},\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2194,\"publishDate\":\"2025-12-07T16:10:38Z\",\"message\":\"🤔 Что известно про graceful shutdown и где применяется?\\n\\nGraceful shutdown — это корректное завершение работы приложения:\\n- Завершение активных соединений;\\n- Очистка ресурсов (например, соединений с БД);\\n- Применяется в серверных приложениях, микросервисах, особенно при развертывании и обновлении.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":54},{\"kind\":\"MessageEntitySpoiler\",\"offset\":57,\"length\":245},{\"kind\":\"MessageEntityTextUrl\",\"offset\":350,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":350,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":353,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":353,\"length\":11}],\"meta\":{\"views\":2106,\"forwardsCount\":4,\"commentsCount\":0,\"reactionsCount\":5,\"publishDate\":\"2025-12-07T16:10:38Z\",\"deletedAt\":null,\"reactions\":[{\"count\":3,\"emoticon\":\"🔥\"},{\"count\":2,\"emoticon\":\"👍\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2193,\"publishDate\":\"2025-12-07T09:05:40Z\",\"message\":\"$4e\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityUnderline\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":117},{\"kind\":\"MessageEntityUnderline\",\"offset\":2,\"length\":117},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":261,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":263,\"length\":51},{\"kind\":\"MessageEntityPre\",\"offset\":793,\"length\":137,\"language\":\"jsx\"},{\"kind\":\"MessageEntityPre\",\"offset\":976,\"length\":360,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1341,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":1343,\"length\":50},{\"kind\":\"MessageEntityPre\",\"offset\":1537,\"length\":317,\"language\":\"jsx\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1859,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":1861,\"length\":23},{\"kind\":\"MessageEntityCode\",\"offset\":1998,\"length\":1},{\"kind\":\"MessageEntityCode\",\"offset\":2002,\"length\":7},{\"kind\":\"MessageEntityCode\",\"offset\":2018,\"length\":8},{\"kind\":\"MessageEntityCode\",\"offset\":2029,\"length\":21},{\"kind\":\"MessageEntityCode\",\"offset\":2086,\"length\":2},{\"kind\":\"MessageEntityCode\",\"offset\":2091,\"length\":4},{\"kind\":\"MessageEntityCode\",\"offset\":2116,\"length\":12},{\"kind\":\"MessageEntityPre\",\"offset\":2199,\"length\":126,\"language\":\"js\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":2330,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":2332,\"length\":45},{\"kind\":\"MessageEntityCode\",\"offset\":2478,\"length\":8},{\"kind\":\"MessageEntityCode\",\"offset\":2496,\"length\":3},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":2748,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":2750,\"length\":32},{\"kind\":\"MessageEntityPre\",\"offset\":3037,\"length\":92,\"language\":\"js\"},{\"kind\":\"MessageEntityPre\",\"offset\":3154,\"length\":196,\"language\":\"js\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":3352,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":3354,\"length\":24},{\"kind\":\"MessageEntityPre\",\"offset\":3445,\"length\":112,\"language\":\"ts\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":3562,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":3564,\"length\":23},{\"kind\":\"MessageEntityBold\",\"offset\":3755,\"length\":6},{\"kind\":\"MessageEntityTextUrl\",\"offset\":3761,\"length\":2,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":3761,\"length\":2},{\"kind\":\"MessageEntityBold\",\"offset\":3763,\"length\":11},{\"kind\":\"MessageEntityTextUrl\",\"offset\":3774,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":3774,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":3777,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":3777,\"length\":11}],\"meta\":{\"views\":2085,\"forwardsCount\":21,\"commentsCount\":0,\"reactionsCount\":3,\"publishDate\":\"2025-12-07T09:05:40Z\",\"deletedAt\":null,\"reactions\":[{\"count\":2,\"emoticon\":\"🔥\"},{\"count\":1,\"emoticon\":\"👍\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2192,\"publishDate\":\"2025-12-06T16:10:39Z\",\"message\":\"🤔 Как использовать селектор?\\n\\nСелектор в CSS используется для выбора элементов по тегу, классу, ID или атрибуту. \\nВ JS селекторы используются через document.querySelector() или useRef в React.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":27},{\"kind\":\"MessageEntitySpoiler\",\"offset\":30,\"length\":163},{\"kind\":\"MessageEntityTextUrl\",\"offset\":241,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":241,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":244,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":244,\"length\":11}],\"meta\":{\"views\":2036,\"forwardsCount\":4,\"commentsCount\":0,\"reactionsCount\":7,\"publishDate\":\"2025-12-06T16:10:39Z\",\"deletedAt\":null,\"reactions\":[{\"count\":5,\"emoticon\":\"👍\"},{\"count\":2,\"emoticon\":\"🔥\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2191,\"publishDate\":\"2025-12-06T09:05:40Z\",\"message\":\"$4f\",\"entities\":[{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityUnderline\",\"offset\":3,\"length\":40},{\"kind\":\"MessageEntityBold\",\"offset\":3,\"length\":39},{\"kind\":\"MessageEntityCode\",\"offset\":109,\"length\":8},{\"kind\":\"MessageEntityCode\",\"offset\":156,\"length\":4},{\"kind\":\"MessageEntityCode\",\"offset\":235,\"length\":4},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":334,\"length\":2,\"documentId\":\"5390810192776540374\"},{\"kind\":\"MessageEntityBold\",\"offset\":336,\"length\":4},{\"kind\":\"MessageEntityCode\",\"offset\":378,\"length\":4},{\"kind\":\"MessageEntityPre\",\"offset\":465,\"length\":159,\"language\":\"javascript\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":626,\"length\":2,\"documentId\":\"5390810192776540374\"},{\"kind\":\"MessageEntityBold\",\"offset\":628,\"length\":5},{\"kind\":\"MessageEntityCode\",\"offset\":650,\"length\":4},{\"kind\":\"MessageEntityPre\",\"offset\":716,\"length\":164,\"language\":\"javascript\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":882,\"length\":2,\"documentId\":\"5390810192776540374\"},{\"kind\":\"MessageEntityBold\",\"offset\":884,\"length\":4},{\"kind\":\"MessageEntityCode\",\"offset\":973,\"length\":4},{\"kind\":\"MessageEntityCode\",\"offset\":1022,\"length\":4},{\"kind\":\"MessageEntityCode\",\"offset\":1029,\"length\":5},{\"kind\":\"MessageEntityCode\",\"offset\":1036,\"length\":4},{\"kind\":\"MessageEntityPre\",\"offset\":1125,\"length\":194,\"language\":\"javascript\"},{\"kind\":\"MessageEntityBold\",\"offset\":1321,\"length\":6},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1327,\"length\":2,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":1327,\"length\":2},{\"kind\":\"MessageEntityBold\",\"offset\":1329,\"length\":11},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1340,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":1340,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":1343,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":1343,\"length\":11}],\"meta\":{\"views\":2287,\"forwardsCount\":20,\"commentsCount\":0,\"reactionsCount\":7,\"publishDate\":\"2025-12-06T09:05:40Z\",\"deletedAt\":null,\"reactions\":[{\"count\":5,\"emoticon\":\"👍\"},{\"count\":2,\"emoticon\":\"🔥\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2190,\"publishDate\":\"2025-12-05T22:45:16Z\",\"message\":\"Видовые квартиры в Ялте с собственным пляжем\\n\\nЖК \\\"Юсуповский\\\" — ваша личная резиденция бизнес-класса на берегу моря!\\nЗдесь каждый элемент говорит о статусе: от величественного фасада до 2-этажного SPA и фитнес-центра на территории.\\n\\n✅ Панорамное остекление\\n✅ Открытый подогреваемый бассейн и закрытый двор-парк 2 га\\n✅ 2-этажные квартиры\\n✅ Трансфер к пляжу\\n✅ Реликтовый парк и водопад на территории.\\n\\nВсего в нескольких минутах езды: Ливадийский дворец, Солнечная тропа, ведущая вдоль побережья, а также лучшие рестораны и культурные, развлекательные объекты Ялты.\\n\\nЭто инвестиция в будущее: Ваш второй дом и источник вдохновения для будущих поколений.\\n\\nДо 30 ноября 2025 года вы можете купить квартиры в рассрочку 0%. Не упустите эту возможность! \\n\\nКупить\\n\\nПроектная декларация на сайте https://наш.дом.рф/. Застройщик: ООО СЗ ВОЛГА. Финансовые услуги оказывает: ПАО \\\"Сбербанк\\\".\\n\\n#реклама \\ngk-yusupovskiy.ru\\nО рекламодателе\",\"mediaRaw\":\"{\\\"_\\\": \\\"MessageMediaPhoto\\\", \\\"spoiler\\\": false, \\\"photo\\\": {\\\"_\\\": \\\"Photo\\\", \\\"id\\\": 5305324671710464936, \\\"date\\\": \\\"2025-12-05T22:45:16+00:00\\\", \\\"sizes\\\": [{\\\"_\\\": \\\"PhotoStrippedSize\\\", \\\"type\\\": \\\"i\\\", \\\"bytes\\\": \\\"ASgohVMrnNL5XvTVVj0GaXY/pWQCtEVIAIJPpTxbnHJwafaR5kJYdBxUjcE5IGD3q0l1Fa5UeMoeelFWLgqUYDsM/rRUySvoFmV0xtOQPxNG9f7gpox3oOO1SBbssNI/AHy0yZ/nZSeh9KLNwjPk4JXiq8zbnJOSa0WwyVv4/TYOn1FFQpJguD/EuB+YNFJ6gKCR3xS5JGM8UUVAhvcEHBBzRj1OaKKd9BjRGAc5JxRRRSuB\\\"}, {\\\"_\\\": \\\"PhotoSizeProgressive\\\", \\\"type\\\": \\\"y\\\", \\\"w\\\": 1080, \\\"h\\\": 1080, \\\"sizes\\\": [14102, 39336, 84735, 116592, 181038]}], \\\"has_stickers\\\": false}}\",\"entities\":[{\"kind\":\"MessageEntityTextUrl\",\"offset\":0,\"length\":44,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FEI8BlF908B6kb6%2F%3Ferid%3Dj1SUn1uhGqMB7JjJH\"},{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":44},{\"kind\":\"MessageEntityTextUrl\",\"offset\":749,\"length\":6,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2Fr6vEKZA_8B6kbE%2F%3Ferid%3Dj1SUn1uhGqMB7JjJH\"},{\"kind\":\"MessageEntityBold\",\"offset\":749,\"length\":6},{\"kind\":\"MessageEntityItalic\",\"offset\":757,\"length\":30},{\"kind\":\"MessageEntityTextUrl\",\"offset\":787,\"length\":19,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2F%D0%BD%D0%B0%D1%88.%D0%B4%D0%BE%D0%BC.%D1%80%D1%84%2F\"},{\"kind\":\"MessageEntityItalic\",\"offset\":787,\"length\":19},{\"kind\":\"MessageEntityItalic\",\"offset\":806,\"length\":72},{\"kind\":\"MessageEntityHashtag\",\"offset\":880,\"length\":8},{\"kind\":\"MessageEntityTextUrl\",\"offset\":889,\"length\":18,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2FEI8BlF908B6kb6%2F%3Ferid%3Dj1SUn1uhGqMB7JjJH\"},{\"kind\":\"MessageEntityTextUrl\",\"offset\":908,\"length\":15,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Fya.cc%2Ft%2Fziuv475H8B6kbC%2F%3Ferid%3Dj1SUn1uhGqMB7JjJH\"}],\"meta\":{\"views\":1348,\"forwardsCount\":0,\"commentsCount\":0,\"reactionsCount\":2,\"publishDate\":\"2025-12-05T22:45:16Z\",\"deletedAt\":\"2025-12-07T20:52:11Z\",\"reactions\":[{\"count\":2,\"emoticon\":\"💊\"}],\"isAd\":false},\"album\":[],\"photo\":{\"width\":1080,\"height\":1080,\"size\":181038,\"url\":\"\",\"thumbUrl\":\"\",\"thumbBase64\":\"$50\",\"lazyUrl\":\"https://n1.tlmtr.cc/lazy/5305324671710464936\"},\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2189,\"publishDate\":\"2025-12-05T16:10:38Z\",\"message\":\"🤔 Как делать HTML-форму?\\n\\nHTML-форма создается с помощью тега \u003cform\u003e, внутри которого размещаются элементы управления: \u003cinput\u003e, \u003cselect\u003e, \u003ctextarea\u003e, \u003cbutton\u003e. Атрибуты action и method указывают, куда и каким способом отправлять данные. Например, \u003cform method=\\\"post\\\" action=\\\"/submit\\\"\u003e.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"entities\":[{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":3,\"length\":22},{\"kind\":\"MessageEntitySpoiler\",\"offset\":27,\"length\":249},{\"kind\":\"MessageEntityBotCommand\",\"offset\":276,\"length\":7},{\"kind\":\"MessageEntitySpoiler\",\"offset\":276,\"length\":7},{\"kind\":\"MessageEntitySpoiler\",\"offset\":283,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":334,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":334,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":337,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":337,\"length\":11}],\"meta\":{\"views\":2146,\"forwardsCount\":4,\"commentsCount\":0,\"reactionsCount\":8,\"publishDate\":\"2025-12-05T16:10:38Z\",\"deletedAt\":null,\"reactions\":[{\"count\":6,\"emoticon\":\"👍\"},{\"count\":2,\"emoticon\":\"💊\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2188,\"publishDate\":\"2025-12-05T09:05:38Z\",\"message\":\"$51\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityUnderline\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":31},{\"kind\":\"MessageEntityUnderline\",\"offset\":2,\"length\":31},{\"kind\":\"MessageEntityCode\",\"offset\":179,\"length\":4},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":269,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":271,\"length\":51},{\"kind\":\"MessageEntityPre\",\"offset\":366,\"length\":132,\"language\":\"html\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":500,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":502,\"length\":52},{\"kind\":\"MessageEntityPre\",\"offset\":605,\"length\":134,\"language\":\"html\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":741,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":743,\"length\":43},{\"kind\":\"MessageEntityCode\",\"offset\":877,\"length\":12},{\"kind\":\"MessageEntityCode\",\"offset\":892,\"length\":13},{\"kind\":\"MessageEntityPre\",\"offset\":907,\"length\":168,\"language\":\"html\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1077,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":1079,\"length\":50},{\"kind\":\"MessageEntityCode\",\"offset\":1195,\"length\":5},{\"kind\":\"MessageEntityCode\",\"offset\":1217,\"length\":5},{\"kind\":\"MessageEntityPre\",\"offset\":1238,\"length\":96,\"language\":\"html\"},{\"kind\":\"MessageEntityPre\",\"offset\":1387,\"length\":59,\"language\":\"css\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1448,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":1450,\"length\":34},{\"kind\":\"MessageEntityCode\",\"offset\":1573,\"length\":18},{\"kind\":\"MessageEntityPre\",\"offset\":1593,\"length\":220,\"language\":\"html\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":1815,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":1817,\"length\":36},{\"kind\":\"MessageEntityCode\",\"offset\":1936,\"length\":7},{\"kind\":\"MessageEntityCode\",\"offset\":1948,\"length\":20},{\"kind\":\"MessageEntityPre\",\"offset\":1970,\"length\":159,\"language\":\"html\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":2131,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":2133,\"length\":33},{\"kind\":\"MessageEntityPre\",\"offset\":2214,\"length\":178,\"language\":\"html\"},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":2394,\"length\":2,\"documentId\":\"5393304190091014249\"},{\"kind\":\"MessageEntityBold\",\"offset\":2396,\"length\":28},{\"kind\":\"MessageEntityCode\",\"offset\":2504,\"length\":22},{\"kind\":\"MessageEntityCode\",\"offset\":2559,\"length\":11},{\"kind\":\"MessageEntityCode\",\"offset\":2573,\"length\":12},{\"kind\":\"MessageEntityPre\",\"offset\":2633,\"length\":216,\"language\":\"html\"},{\"kind\":\"MessageEntityBold\",\"offset\":2851,\"length\":6},{\"kind\":\"MessageEntityTextUrl\",\"offset\":2857,\"length\":2,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":2857,\"length\":2},{\"kind\":\"MessageEntityBold\",\"offset\":2859,\"length\":11},{\"kind\":\"MessageEntityTextUrl\",\"offset\":2870,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":2870,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":2873,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":2873,\"length\":11}],\"meta\":{\"views\":2351,\"forwardsCount\":21,\"commentsCount\":0,\"reactionsCount\":6,\"publishDate\":\"2025-12-05T09:05:38Z\",\"deletedAt\":null,\"reactions\":[{\"count\":6,\"emoticon\":\"👍\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null},{\"channel\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"messageId\":2187,\"publishDate\":\"2025-12-04T16:10:38Z\",\"message\":\"🤔 Как добавить класс на элемент по условию?\\n\\nЕсли тебе нужно применять стили к элементу в зависимости от какого-то состояния, Vue позволяет это сделать динамически. Ты просто указываешь, когда класс должен применяться, а когда нет. Это удобно для подсветки выбранных элементов, отображения ошибок или изменения внешнего вида по действиям пользователя.\\n\\nСтавь 👍 если знал ответ, 🔥 если нет\\nЗабирай 📚 Базу знаний\",\"entities\":[{\"kind\":\"MessageEntityBold\",\"offset\":0,\"length\":2},{\"kind\":\"MessageEntityCustomEmoji\",\"offset\":0,\"length\":2,\"documentId\":\"5431527977391237948\"},{\"kind\":\"MessageEntityBold\",\"offset\":2,\"length\":42},{\"kind\":\"MessageEntitySpoiler\",\"offset\":45,\"length\":307},{\"kind\":\"MessageEntityTextUrl\",\"offset\":400,\"length\":3,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feo_test_task_bot\"},{\"kind\":\"MessageEntityBold\",\"offset\":400,\"length\":3},{\"kind\":\"MessageEntityTextUrl\",\"offset\":403,\"length\":11,\"url\":\"https://go.tlmtr.io/go?from=channel\u0026url=https%3A%2F%2Ft.me%2Feasy_javascript_ru%2F596\"},{\"kind\":\"MessageEntityBold\",\"offset\":403,\"length\":11}],\"meta\":{\"views\":2126,\"forwardsCount\":5,\"commentsCount\":0,\"reactionsCount\":8,\"publishDate\":\"2025-12-04T16:10:38Z\",\"deletedAt\":null,\"reactions\":[{\"count\":4,\"emoticon\":\"💊\"},{\"count\":2,\"emoticon\":\"👍\"},{\"count\":2,\"emoticon\":\"🔥\"}],\"isAd\":false},\"album\":[],\"photo\":null,\"video\":null}],\"chats\":[{\"id\":{\"internalId\":\"25KaBb\",\"telegramId\":\"1917151177\"},\"title\":\"Frontend | Вопросы собесов\",\"membersCount\":17861,\"peer\":\"PEER_TYPE_CHANNEL\",\"username\":\"easy_javascript_ru\",\"inviteLink\":\"UQwQa_915h8zYTUy\",\"photoId\":\"5431453649143450783\",\"photoUrl\":\"https://img.tlmtr.io/c/25KaBb/5431453649143450783?ty=x\",\"err\":6.7162924,\"postViews\":1200,\"country\":{\"countryId\":\"russia\"},\"language\":{\"languageId\":\"ru\"},\"category\":[{\"categoryId\":\"1Y5Zq3WYB\",\"slug\":\"technology-and-applications\"}],\"telegramFlags\":{\"verified\":false,\"scam\":false,\"fake\":false,\"restricted\":false},\"collectorFlags\":{\"verified\":false,\"cheater\":false,\"blocked\":false,\"onlyForOwners\":false,\"cheaterInfo\":{\"participants\":0.21322321891784668,\"views\":0.19698961079120636,\"appeal\":false,\"updatedAt\":\"2026-08-22T20:20:42Z\",\"reason\":\"CHEATER_REASON_UNSPECIFIED\"}},\"isPlaceholder\":false,\"link\":\"https://t.me/easy_javascript_ru\",\"privacy\":\"CHAT_PRIVACY_PUBLIC\",\"stableSlug\":\"1917151177-easy_javascript_ru\"}],\"cursor\":\"IKgF\"}}]\n"])</script></body></html>