UfoStation

Frontend CTF 2025

Запуск сегодня в 19:03 (по мск), это уже совсем скоро

Чат участников - @yalovefrontend_ctf

За эти новогодние каникулы поднял количество решенных задач на leetcode с ~170 до ~240. Согласен, для опытных алгоритмистов конечная цифра небольшая, но для себя, можно сказать, устроил марафон. Вместе с этим приобрел дополнительную литературу, чтобы закрыть основные пробелы. Хотелось бы и дальше практиковаться в решении алгоритмических задач. Зачем? Алгоритмы в большинстве крупных компаний это один из этапов технического собеседования. Алгоритмы помогут реализовывать что-то интересное, например, летом я делал шутер от первого лица. Это те знания, которые не устареют в ближайшие десятилетия точно, считайте база. Так о чем это я?

На фоне всего этого хотел бы поинтересоваться у читающих канал:

Станция НЛО. Специальный выпуск #1

Тема: Воспоминания о Китае
Гость: Василий Кузенков, персональный канал @webcorner

Содержание

00:00:26 Знакомство с гостем
00:13:45 Вход в китайский язык
00:17:58 Языковые особенности, слэнг
00:22:34 Китайский интернет
00:30:48 Компьютерные клубы
00:33:10 Строгий/анонимный доступ в интернет
00:36:54 Интернет-сервисы (аналоги gmail, youtube, steam)
00:44:02 Разработчики в Китае
00:46:44 Как появляются разрабы
00:53:07 Китайский IT рынок
00:58:24 Известные китайские продукты
01:00:55 Рынок стартапов в Китае
01:03:27 Желание уехать из Китая
01:07:53 Можно ли выйти из IT
01:09:14 Участие государства в жизни частных компаний
01:12:31 Слежка за постами в сети
01:14:08 Work life balance, работа 6 дней в неделю и выгорания
01:19:53 Уровень линейного разработчика
01:21:54 Если захотелось в Китай

Материалы к выпуску

— Маг на полную ставку, новелла с участием в переводе Василия
— Путешествие на Запад, один из классических романов
— Искусство войны, Сунь-цзы, древнейший трактат
— Троецарствие, исторический роман XIV века
— Tencent, известная компания

@xufostation, канал про разработку и информационные технологии

С наступающим 2025 годом 🎆

Желаю всем и каждому профессиональных успехов, счастья в личной жизни, здоровья и всего того, что сделает вас счастливее 🎅

И я вам небольшой подарочек принес👇

Advent of Typescript

Совсем скоро (1 декабря) на typehero.dev начнется событие, приуроченное к концу года. Каждый день будет публиковаться задача по TS, и с каждым разом сложность будет расти.

В этом году обещают завести лидерборд и даже какие-то призы для самых крутых. Отличный повод освежить знания по TS и написать калькулятор на типах👍

На канале я буду каждый день выкладывать решение дэйли-задачи, как уже делал в прошлом году. Присоединяйтесь!

Учел ваши пожелания и собрал все посты по теме многозадачности и производительности в один пост. Приятного чтения😊

🔹Многозадачность на уровне железа и OS / Kernel Space

1. Многозадачность в OS. Введение.
2. Процессор и его роль в многозадачности
2.1. Про Hyper Threading
3. Процессы. Начало
4. Процессы в Linux
5. Потоки. Начало
6. Потоки в Linux
7. Модели ввода-вывода. Универсальная(блокирующая) модель ввода-вывода
8. Multiplexed IO
9. Asynchronous IO

🔹Легковесные потоки в User Space / Многозадачность в языках программирования

10. Fibers. Виды многозадачности с примерами в языках программирования.
11. Сравнительный обзор двух видов многозадачности

browser.engineering

Два-три года назад у меня было желание начать написать небольшую книгу про то как работает браузер. Можно просколлить далеко вверх и увидеть посты на тему внутреннего устройства браузера и несколько докладов основанных на Chromium University.

Примерно в то же время, я обнаружил для себя, что два автора, Павел Панчеха, профессор университета штата Юта (professor in the School of Computing at the University of Utah) и Крис Харрелсон, инженер и лид в команде рендеринга (Rendering lead and Principal Software Engineer at Google), начали писать книгу, о том как написать свой браузер с нуля. Было составлено содержание будущей книги и написано несколько первых глав. Желание писать свою книгу отпало. Зачем, когда есть кто-то поумнее и поопытнее?

Сейчас книга дописана, доступна в электронном виде и готовиться к «бумажной» публикации, правда авторы скромничают и пишут, что книга и сейчас и в будущем будет дорабатываться (work in progress).

В книге Web Browser Engineering объясняется, как создать простой, но полноценный веб-браузер с помощью нескольких тысяч строк кода на Python. Книжный браузер будет использовать сетевые технологии, отрисовывать web-страницу, использовать JavaScript, GPU и прочее и прочее.

Уже начиная с первой главы, начинается разработка, а каждая следующая основывается на предыдущей и расширяет возможности разрабатываемого браузера.

Рекомендую детальнее ознакомится с книгой тем, кого интересует данная тема или полистать содержание книги хотя бы по диагонали и почитать исходники «лабораторных работ». Это сформирует идею того, как все может работать под капотом.

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

Запустил одну из последних лабораторных размером в ~3,5k строк кода на Python, чтобы оценить результат. На скрине выше не запускается JavaScript, поскольку в качестве библиотеки для интерпретации используется dukpy, очень простой интерпретатор JavaScript на Python.

Есть конечно вероятность, что я что-то упустил про сборке.

Doom на CSS

Думаю, вы слышали, что Doom на чём только не запускали. На калькуляторах, градусниках и тестах для беременности было. Даже на микроорганизмах с крайне низким FPS было.

К сожалению, на HTML и CSS полноценный Doom я не видел, но наткнулся на потрясающую демку Адама Куна, где он при помощи Scroll Animation API и 3D-трансформаций сделал возможность передвигаться по 3D-карте, стрелять в монстров, всё это в узнаваемой стилистике.

По мне так потрясающий эффект, который можно применять на каких-нибудь лендингах. Потому что реализуется относительно просто, завязано на привычный скролл, механика «погулять по помещению» может много где пригодиться.

https://codepen.io/cobra_winfrey/pen/oNOMRav

В этом месяце исполняется 30 лет легендарной книге

Известной и популярной книге, написанной бандой четырех (Эрих Гамма, Ричард Хелм, Ральф Джонсон, Джон Влиссидес) еще в далеком 1994, в октябре этого года исполняется 30 лет.

Если вдруг вы видите ее впервые, то доложу, что в книге описывается роль ООП паттернов в архитектуре сложных систем. В частности авторы разрабатывают редактор документов, используя паттерны, а затем разбирают каждый из них в отдельности.

Полезна книга будет тем разработчикам, кто уже имеет некоторый опыт написания в ООП парадигме. Тем, кто смешивал экземпляров разных классов и искал эффективный путь их взаимодействия между собой.

Теперь до конца года буду рассматривать только технические темы 😎

С одной стороны, может показаться, что OKR это совсем не сложная методология, когда ты уже являешься участником процесса, следишь за их выполнением и после занимаешься ретроспективой. С другой стороны очень важно понимать куда ты идешь, куда идет твоя команда и что продвижение действительно присутствует, также важно в нужный момент отказаться от цели, если она не уже актуальна.

У OKR существуют и проблемы. Например, команду принуждают использовать OKR, что может превратить использование методологии в карго-культ, в которой команда лишь формально удовлетворяет требования и двигается по пути наименьшего сопротивления, предъявляя минимальные требования к своим целям.

Для дополнительного чтения:
— Рич Спаркс. OKR: полное руководство по целям и ключевым результатам
— OKR для начинающих, Перевод книги Felipe Castro «The Beginners Guide to OKR»

Кстати, если вдруг хотите повторить успех в венчурных инвестициях в России, то спешу вас расстроить. Во-первых, IT-рынок занимает всего лишь ~2% от ВВП (по данным 2023 года), во-вторых, объемы инвестиций снизились в разы, смотрите инфографику выше.

Источник инфографики, Venture Guide

В следующих постах посмотрим как OKR работает на деле

Главный популяризатор OKR

Джон Дорр считается одним из наиболее успешных венчурных капиталистов в истории, внесшим значительный вклад в развитие технологического сектора США.

В прошлом он работал в Intel Corporation. Сейчас является сооснователем Kleiner Perkins, одной из ведущих венчурных фирм в США и занимает 169 место в списке Forbes.

В свое время Джон Дорр написал книгу «Измеряйте самое важное», которая стала ключевым источником информации о системе OKR. Система была впервые применена в 1970-е годы в корпорации Intel, но Джон сделал ее более известной и доступной широкому кругу читателей. Он отмечает важность формулирования целей и ключевых результатов и все это не просто цели, а живой процесс, который требует регулярного пересмотра и уточнения.

Пусть часть экспертов отмечают, что в книге есть некоторые неточности в интерпретации OKR, тем не менее опытные практики рекомендуют сперва ознакомиться с этой книгой, а затем дополнять ее знания другими источниками для более глубокого понимания системы.

Помимо книги от Джон Дорра можно ознакомится с курсом OKRs 101 на whatmatters.com, в котором он также принимал участие.

Видео выше — отрывок из фильма: «Загрузка: Подлинная история Интернета»

Перед тем как вернутся к хардскилловым темам на канале, хочется поговорить об еще одной не технической, но прежде вопрос

Результаты опроса Gallup 12 подписчиков

После каждого вопроса указан процент положительных ответов

Базовые потребности
Q1. Знаете ли вы, чего ожидает от вас работодатель? 87,4%
Q2. У вас есть материалы и инструменты, необходимые для качественной работы? 87,4%

Персональный вклад
Q3. У вас есть возможность каждый день делать то, что вы умеете лучше всего? 78,4%
Q4. За последние семь дней вы получали признание или похвалу за хорошую работу? 45%
Q5. Считаете ли вы, что ваш руководитель или кто-то на работе заботится о вас как о личности? 50,5%
Q6. Кто-нибудь на работе способствует вашему развитию? 50,5%

Командная работа
Q7. Учитывается ли ваша точка зрения? 89,2%
Q8. Миссия и цель вашей компании заставляет вас чувствовать, что ваша работа важна? 46,8%
Q9. Считают ли ваши коллеги своей обязанностью качественно выполнять свою работу? 67,6%
Q10. У вас есть лучший друг на работе? 26,1%

Рост
Q11. За последние полгода кто-нибудь на работе говорил с вами о ваших успехах? 63,1%
Q12. В прошлом году у вас были возможности учиться и расти на работе? 77,5%

Выводы

Средний уровень вовлеченности ~64% — это удовлетворительный результат, однако есть над чем работать. 6 ответивших оказались вовлечены на все 100%, а самый низкий уровень вовлеченности 30% обнаружен у 4ех ответивших, увольнять их конечно же не будем.

Поскольку все анкеты являются анонимными, результаты опроса решил выложить в открытый доступ. Возможно вы захотите сделать какой-нибудь свой дополнительный анализ.

Выбрал случайным образом номер комментария.
Поздравляю @galoev с победой 😎

Поздравляю всех с Днём знаний!

В связи с этим хочу подарить случайному подписчику канала, который оставит любой адекватный комментарий под этим постом, необходимую ему компьютерную литературу (на выбор) стоимостью до 5к рублей

Завтра в 14:00 (по мск) выберу победителя

Предлагаю пройти тест и посчитать уровень вовлеченности тех, кто подписан на канал. Если будет больше 30 заполненных форм, тогда озвучу публично в конце следующей недели результаты.

Собеседование в Авито и не только

В настоящее время процесс прохождения собеседования в большинство крупных компаний имеет схожие черты и отличается лишь незначительно. Эти отличия определяются конкретной компанией, конкретной вакансией, а также лицом, проводящим интервью на каждом из шагов. Шаги могут быть объединены в секции и/или в этапы и проходить в один или несколько дней.

Ниже расскажу как устроен процесс собеседования и мой личный опыт прохождения.

Для инженеров в Авито выделяют 3 этапа собеседования:

1) Первичное интервью

Оно же скоринговое интервью. Насколько мне известно, здесь происходит первичный созвон и кандидату задают небольшое количество вопросов на знание теории и практики в соответствии с вакансией. По итогам собеседования технический специалист даёт оценку кандидату, в случае успеха — добро пожаловать на следующий этап.

В моем случае со мной связался HR и предложил сразу согласовать следующий этап. Подозреваю, причина в резюме и в том, что оно попало по рекомендации от уже работающего внутри компании, это называется «прийти по рефералке».

2) Техническое интервью , состоящие для разработчиков из 3 секций:

・Программирование. В этой секции вам дают задачи, похожие на то, что можно встретить на leetcode. Вам необходимо будет на выбранном языке, но подходящего вакансии, написать решение, причем без запуска кода. В коде могут быть опечатки, не страшно. Важно объяснить сам алгоритм и определить его алгоритмическую сложность. Кстати одна из задач, которая мне попалась разбиралась на канале Algorithmics: хакаем алгоритмические собесы — рекомендую подписать, если собираетесь готовиться к этой секции.

・Платформа. Здесь проверяются знания в конкретном языке программирования и понимание разработки в рамках экосистемы этого языка. Frontend-разработчик? Что такое область видимости? Замыкание? Event Loop? Разреши цепочку промисов? Напиши с нуля что-то похожее JQuery. В общем спрашивают базу и то, как JavaScript работает в браузере, возможно как работает сам браузер.

・Проектирование. Более распространенное название — System design. Секция опциональна и идёт последней при успешном прохождении предыдущих, плюс является главным дифференциатором для попадания на уровень E5 (сеньор). Если кто не сталкивался с проектированием, полистайте книжку Alex Xu. System Design Interview, можно поискать русский перевод. Кратко, вас попросят высокоуровнево и с нуля спроектировать какой-нибудь сервис. Мне предложили спроектировать мессенджер общения покупателей и продавцов в Авито.

Цель данного этапа — определить уровень инженера. Добавлю, что человеческий фактор для первых двух секции свиден к минимуму: есть внутренняя база вопросов с уже известными и ожидаемыми ответами.

3) Финальное интервью

На финальной встрече, в моем случае, мой будущий тимлид описывал, чем занимается команда, конкретные рабочие задачи и как устроены процессы. В рамках финального интервью проходит и поведенческое интервью, спрашивают как поведешь себя в той или иной ситуации, например, как будешь разрешать конфликт с коллегой, который не согласен с твоим Pull Request. На этом этапе оценивается насколько кандидату будет комфортно с потенциальными коллегами, будут ли интересны ему задачи, соответствуют ли его взгляды ценностям и культуре компании.

Оффер

По итогу нанимающие менеджеры и HR принимают окончательное решение. Если все успешно, то будет предоставлен оффер — пришлют PDF файлик с указанием зарплаты и детальным описанием условий работы.

К чему такие трудности

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

Дополнительные материалы
・Avito Playbook — открытый справочник по ценностям, бизнес-процессам, стандартам, процедурам и правилам, которые мы используем в команде разработки в Авито
・Выпуск подкаста iterka — как попасть в Авито: резюме, собеседования и испытательный срок в топовой АйТи компании

В комментариях к заметке выше спрашивали про собеседование в компанию Авито. Отвечаю.

Давайте снова знакомиться

Обычно я не транслирую место, в котором работаю, на большую публику, если не считать выступлений с докладами, потому что или получаю новый опыт параллельно основным задачам или высказываю что-то в отрыве от компании. Однако скоро будет полгода, как я работаю в Авито, здесь я продолжил свой рост как специалист, что ценно, особенно после продолжительной стагнации более года. Поэтому в канале иногда буду делиться тем опытом, который получил, именно работая в Авито.

Чем занимаюсь? Пусть никто таких слов не говорил вслух в моей команде, но похоже это FrontOps. Конечно, нужно будет прогрузиться в это понятие поглубже, проанализировать, чтобы сказать наверняка и не вводить себя и читающих канал в заблуждение. Тем не менее это первое слово, которое приходит в голову, когда хочется описать, чем занимаешься. Кратко, есть множество команд, где есть frontend проекты, нашей команде необходимо предлагать решения для улучшения и поддерживать текущие pipeline сборки.

Насчет технологий, в большинстве приходится писать на JavaScript, иногда на TypeScript, Bash или Golang, на этой неделе неожиданно для себя написал небольшой скрипт на lua для конфигурирования nginx.

Когда у тебя проект один, где ты настроил webpack или rollup или взял практически не требующий настройки vite, написал yaml файл для pipeline, то кажется, ну и что такого, ведь работы от силы на день? Теперь представьте, что таких проектов сотни, pipeline могут отличаться. Вам необходимо помогать с возникающими в них проблемами, подталкивать разработчиков к обновлениям на актуальные версии и стремиться ускорить pipeline, используя новые инструменты или улучшая существующие. В общем, необходимо делать все, чтобы повысить скорость попадания кода в продакшен, в идеале, чтобы продуктовые разработчики разрабатывали фичи, не задумывались о проблемах сборки.

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

PS. Игрушку из заметок выше не забрасываю — привнес несколько фич

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

В период отсутствия активности я провел время за размышлениями о направлении своего будущего контента. Мне бы хотелось внести больше личного и эмоционального в мои записи, не ограничиваясь только техническими темами, но при этом сохранить акцент на технологиях и разработке, возможно иногда выпускать пар.

Остался один вопрос..

Хочу довести стрелялку до полноценной игры. Программная часть фоном пусть медленно, но верно продвигается, а вот интерфейс, персонажи и предметы нуждаются в доработке.

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

Если интересно такое, то пишите в личные сообщения @ufocoder

Исходники реализации SSR со стрима выше:
https://github.com/ufocoder/ssr-no-deps

30 июня (в ближайшее воскресенье) в 10:30 будем разрабатывать SSR
https://www.youtube.com/watch?v=xzQjtkhPMdY