Привет!

Я Игорь @kamyshev_code, работаю в команде веб-платформы @aviasales, мы делаем жизнь фронтендеров в компан… twitter.com/i/web/status/1…

Я буду рассказывать в основном про инфраструктурные штуки, но если интересно будет что-то другое — пишите.

План примерно такой: в понедельник говорим о мониторинге и метриках, во вторник про микрофронтенды, в среду про кон… twitter.com/i/web/status/1…

А темы на выходные пусть останутся сюрпризом 🤓

Давайте начнем с мониторинга фронтенда, мы делаем это с необычной стороны

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

Поэтому решили сначала спроектировать систему сбора максимально широкого спектра метрик, а потом, когда придумаем ч… twitter.com/i/web/status/1…

Система сбора метрик получилась простая как железная дорога — Node.js-приложение, которое по HTTP готово отдавать к… twitter.com/i/web/status/1…

Написали этот сервис (дальше я буду называть его экспортером) и начали придумывать, какие метрики нам будут полезны

Мы хотели следить за общим качеством сайта. Первое, что пришло в голову — отслеживать фон ошибок. Сколько пользоват… twitter.com/i/web/status/1…

У нас уже был Rollbar, куда писались все ошибки. Добавили в экспортере запрос к API, чтобы получить число ошибок и… twitter.com/i/web/status/1…

А потом поняли, что получившийся график очень сильно колеблется. Во-первых, ночью меньше людей пользуются нашим сай… twitter.com/i/web/status/1…

Короче, этот график показывал по большей части посещаемость сайта.

Решили нормировать его на число посещений. У нас уже используется snowplow, как транспорт аналитических событий. Ср… twitter.com/i/web/status/1…

Добавили чтение кафка-стрима, парсинг сообщений (отдельный квест распарсить формат snowplow), учет числа посещений.… twitter.com/i/web/status/1…

Получилось как-то так pic.twitter.com/vtDEjpj5Qo

Потом еще много допиливали этот график, но подробности, кмк, уже не так интересны.

Кроме качества, очень хотелось смотреть еще и на производительность. Перформанс — сложно оцениваемая шутка. Оценка… twitter.com/i/web/status/1…

Взяли из web.dev/vitals/ — Largest Contentful Paint и Cumulative Layout Shift. Вообще, основных метрик три… twitter.com/i/web/status/1…

Тут уже тысячу раз рассказывали, что значат эти метрики. Если пропустили, почитайте на сайте web.dev/vitals/

К счастью, и LCP и CLS можно собирать через npm-пакет lighthouse. Правда ему требуется запущенный Хром. Пришлось в… twitter.com/i/web/status/1…

И, кстати, именно с ним мы хапанули гавна — есть какой-то плавающий баг, который приводит к появлению зомби-процесс… twitter.com/i/web/status/1…

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

Получилось в итоге как-то pic.twitter.com/zag8TKgSHf

Сейчас экспортер собирает еще Speed Index, Total Blocking Time, Time to Interactive, First Contentful Paint и Perfo… twitter.com/i/web/status/1…

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

1. Не весь код, котрый грузится на сайте наш — есть рекламные сетки, трекеры, внешний шрифты и еще чорт знает что

2. Хочется знать сколько именно трафик прилетит в браузер — уже после всех сжатий и оптимизаций

И мы решили задачу прямо в лоб — запускаем браузер через puppeteer и записываем размеры всех скачанных ресурсов по… twitter.com/i/web/status/1…

Результат выглядит примерно так pic.twitter.com/Zc55F7fK4v

Сейчас к разработке экспортера подключились продуктовые команды — они добавили сбор более подробных таймингов стран… twitter.com/i/web/status/1…

Расскажите, как вы мониторите свои фронтенды (и мониторите ли вообще)?

Кроме фронтендов, наша команда заведует рядом бекенд-сервисов на Node.js. К ним, конечно, тоже нужен мониторинг. На… twitter.com/i/web/status/1…

Мы собираем число запросов в секунду на входящем nginx по статусам ответа, если не-200 ответов становится больше че… twitter.com/i/web/status/1…

Смотрим на время ответа сервиса — медианное, 99-перцентиль и 99.99-перцентиль, шлем алерты, если видим деградацию.… twitter.com/i/web/status/1…

Да, все наши сервисы живут в Кубернетесе, оттуда можно удобно брать потребляемую контейнерами память и CPU. Смотрим… twitter.com/i/web/status/1…

Ну и главное, мы собираем метрики внутреннего состояния Node.js через библиотеку github.com/siimon/prom-cl…. Она отдае… twitter.com/i/web/status/1…

лаг ивент-лупа (сколько таска в ивент-лупе ждет, пока ее возьмут) и число открытых хэндлов (сколько сейчас открыто… twitter.com/i/web/status/1…

Если лаг ивент-лупа становится слишком большим — нужно что-то делать. Пока просто шлем алерт в Слак, в перспективе… twitter.com/i/web/status/1…

Мониторите Node.js-приложения? На какие показатели смотрите?

У меня на сегодня все 🤗 пишите вопросы (не обязательно про мониторинг)

А это вид с горы недалеко от офиса. pic.twitter.com/g6I3k7IXjF

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

t.me/kamyshev_code

Сейчас выходит много отчетов про изменения на удаленке. Есть и очень положительные, есть и отрицательные. Но не сто… twitter.com/i/web/status/1…

Сегодня расскажу как мы делали новый сервис, который в перспективе должен контролировать почти все страницы на… twitter.com/i/web/status/1…

Сейчас у нас есть Реакт-приложение, оно при сборке рендерится в строку и кладется в html

У этой схемы есть несколько проблемок — сложно контролировать, неудобно дебажить, нельзя показать разным пользовате… twitter.com/i/web/status/1…

Поэтому мы решили сделать новый сервис, который будет прямо на лету генерировать html из Реакт-компонентов. И посмо… twitter.com/i/web/status/1…

В итоге получилось, что каждый виджет — отдельное Реакт-приложение, которое рендерится в своей ноде и об окружающем… twitter.com/i/web/status/1…

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

На тот момент, у нас было два кейса, когда виджетам нужно пообщаться. Мы решили сделать систему, которая будет:

а. хорошо подходить под эти два конкретных кейса

б. легко заменяется на что угодно другое, не аффектит виджеты и вообще стоит максимально в стороне

Второе требование возникло, потому что мы понимали, что эти два кейса — это не конец. А предвидеть что будет дальше не могли.

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

Сейчас оно работает примерно так: каждый виджет получает маленький ивент-эммитер. В него можно бросать события, а можно читать.

Виджет может кидать-читать только «свои» события, то есть виджет никогда не зависит от другого виджета

А чтобы связать два виджета мы используем специальные функции (мы назвали их релейшнами), которые по сути мапят соб… twitter.com/i/web/status/1…

Релелейшн знает о двух виджетах и хранит всю логику их связи.

Когда закончили делать финальный прототип, поняли, что получился кустарный RxJS. Но решили пока не переписывать на него, мало ли что.

А как вы организовываете общение независимых фронтенд-приложений?

@jsunderhood Вообще, было бы интересно послушать чей-нибудь опыт по работе с метриками gc на ноде. Может среди подп… twitter.com/i/web/status/1…

Сделал пример релейшна, чтобы было понятно что он делает. Этот уведомляет первый виджет об изменениях во втором. pic.twitter.com/wYmcDQ7TpL

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

Решили просто как-то просунуть ему ивент-эммитер и разрешить кидать-читать сообщения.

Сделали просто — в новом приложении с виджетами кладем ивент-эммитер в глобальную переменную, а в старом приложении достаем.

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

В итоге в ивент-эммитере сделали накопление событий, а в старом приложении проверяем, если ивент-эммитера нет — жде… twitter.com/i/web/status/1…

Не самое красивое решение — зато простое и работает ¯\(ツ)/¯

На сегодня все.

Сорян, получился короткий день, завтра расскажу больше.

Вот вам фоточка со вчерашней горы, но в д… twitter.com/i/web/status/1…

Давайте сегодня обсудим конфигурацию сборки. Я довольно долго уже пытаюсь найти способ конфигурировать бандлер без… twitter.com/i/web/status/1…

Кек, эта проблема вроде звучит супер-просто. Ну конфигурация, ну напиши и ладно. Но нет!

Вообще, в простом случае конфигурация сборщика — это просто один файл, в котором описано все что нужно. Для вебпака… twitter.com/i/web/status/1…

Это js файл, то есть в нем может выполняться произвольный код для создания финальной конфигурации. В типичном прило… twitter.com/i/web/status/1…

У вас может возникнуть закономерный вопрос — почему вообще конфигурация сборки зависит от каких то аргументов коман… twitter.com/i/web/status/1…

Причин может быть несколько. Как минимум, для разработки и для продакшена обычно используется чуть-чуть разных конф… twitter.com/i/web/status/1…

С другой стороны, сейчас довольно часто создаются фронтенд-приложения с SSR, а код который исполнится на клиенте и… twitter.com/i/web/status/1…

Ну и куча более экзотических вариантов специфичных для конкретного приложения.

Короче, вариативность конфигурации бандлера — это важно.

У кого какие есть боли связанные с конфигурированием инструментов?

@jsunderhood Современные инструменты сборки не умеют переиспользовать между собой промежуточные результаты своей ра… twitter.com/i/web/status/1…

Самый простой способ сделать конфиг изменяющимся под нужды приложения — просто прямо в файле конфигурации завязатьс… twitter.com/i/web/status/1…

Но, кажется, это не очень управляемая история.

Вносить правки в конфиг становится просто невозможно. pic.twitter.com/e3x0bK534K

Число вариантов сборки растёт быстро — дев-клиент, дев-сервер, прод-клиент, прод-сервер. Уже 4, а пока только два п… twitter.com/i/web/status/1…

Впервые я столкнулся с этой проблемой на одном из проектов @BreadheadStudio

У нас было 4 конфиг-файла, в которых просто было много копи-паста. И когда решили принести в проект TypeScript, сде… twitter.com/i/web/status/1…

Тогда я подумал (не очень хорошо, как выяснилось) и решил общие части конфигурации вынести в специальный файл, а сп… twitter.com/i/web/status/1…

В целом, получилось неплохо, но осталось дублирование между дев-клиентским и дев-сервеным конфигами, и между прод-к… twitter.com/i/web/status/1…

А еще было дублирование между дев-серверным и про-серверным конфигами, и соответсвенно между дев-клиентским и прод-клиентским.

И тогда я решил сделать просто — все специфичное для среды разработки вынести в отдельный файл и расширять его в сп… twitter.com/i/web/status/1…

Короче, получилось 5 файлов с «базовыми» конфигами и 4 файла со «специфичными» конфигами. Да, я тогда был не сильно… twitter.com/i/web/status/1…

В итоге, стало только хуже и мы вернули все обратно, копи-паст, так копи-паст.

Следующий заход оказался удачнее. Я посмотрел прекрасный доклад youtube.com/watch?v=Tg8IVb…

И очень проникся этой идеей — вся конфигурация должна быть описана в одном файле. Просто нужно описывать ее на боле… twitter.com/i/web/status/1…

То есть, если именно в этом варианте конфига нужен хот-релоадинг, это должно определяться одной строкой — withHotRe… twitter.com/i/web/status/1…

Тогда я попробовал разбить весь конфиг на атомарные части и собрать финальную версию из этих кусочков.

Получилось как-то так pic.twitter.com/G3iZD0BVuq

Конечно, это тоже не вариант — кусочки конфига слишком маленькие. Но можно объединить подход с общими бизонами наст… twitter.com/i/web/status/1…

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

Основные штуки (транспиляция TS, например) вынесена в общий базовый конфиг, он расширяется через небольшие функции,… twitter.com/i/web/status/1…

Выглядит это примерно вот так в реальном проекте. Здесь withDefaults — тот самый базовый конфиг, а все остальное —… twitter.com/i/web/status/1…

Внутри эти функции выглядит супер-просто, они всего лишь добавляют/расширяют поля конфига. Есть правило — функция-р… twitter.com/i/web/status/1…

А как вы боретесь со сложностью и дублированием в конфигурации сборки?

Вообще, из-за неадекватной сложности при настройке вебпака, я полюбил @parceljs. Для огромного числа проектов в нем… twitter.com/i/web/status/1…

Для всех своих простых пет-проектов я использую именно его. И в @SamokatRu мы использовали parcel для всех внутренних веб-приложений.

Если у вашего приложения нет специфичных требований — смело берите @parceljs, это очень классное решение.

Пару месяцев назад начал делать пет-проект на @sveltejs, они очень советуют использовать бандлер @RollupJS. И вот о… twitter.com/i/web/status/1…

Расскажите, чем так хорош @RollupJS?

Еще, сегодня хотел пошарить довольно больший список докладов, которые считаю супер-крутыми. 👇

Последний доклад, который я посмотрел. Он про написание своего рендерера для реакта (вместо react-dom). Очень позна… twitter.com/i/web/status/1…

Доклад про то как работает голова. Почему опен-спейсы — это отстой, как правильно отдыхать и вот это все.

youtu.be/ytX7Dv3K7Go

Альтернативный взгляд на проектирование приложений. В докладе весь код приводится на C#, но подходы применимы к люб… twitter.com/i/web/status/1…

Контракты — способ убедиться, что программа получает корректные данные на границах (общение по сети, взаимодействие… twitter.com/i/web/status/1…

Обычно все разговоры про ФП заканчиваются на маленьких изолированных примерах кода. Доклад про построение функциона… twitter.com/i/web/status/1…

Крутейший доклад про @hegel_js

youtube.com/watch?v=GIHrPm…

Всех нас занимают вопросы: «Как стать лучшим инженером?», «Как расти профессионально?». На них в целом, похоже нет… twitter.com/i/web/status/1…

Я уверен, что мы должны знать как работают инструменты, которыми пользуемся. Например, веб-разработчики должны пони… twitter.com/i/web/status/1…

При создании приложения очень важно сохранить гибкость. То есть с течением времени сложность внесения изменений не… twitter.com/i/web/status/1…

Простое введение в wasm

youtu.be/8MOZ44j_zFw

youtu.be/fwWA6Bugg_c
youtube.com/watch?v=wRxO5k…

Пара докладов про акторы. Тема специфическая, но, кмк, очень интересная.

Отойду на собес, вернусь и продолжим 😇

Не вышло, сори, затянулся собес, завтра закончу тред 🤗

Про кастомное решение для инструментирования кода и упрощения работы с компонентными фреймворками в браузере.

youtube.com/watch?v=aMP6j6…

Для людей, которые только пришли в индустрию большая проблема расти в ней. Это проблема, у нее нет решения, которое… twitter.com/i/web/status/1…

DDD ван лав, вот простое введение

youtu.be/7HXIrEsmlzM

Вот и все. Кстати, обо всех этих докладах я рассказывал в канале t.me/kamyshev_code сразу как посмотрел их, подписывайтесь.

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

Написал… twitter.com/i/web/status/1…

Чем сильная типизация отличается от слабой? В чём особенности динамической и статической типизации? Какая система т… twitter.com/i/web/status/1…

9:49

Четверг — это последний «серьезный» рабочий день. То есть, почти не рабочий. Поэтому, сегодня я хочу показать вам с… twitter.com/i/web/status/1…

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

В JS есть классная штука — Iteration protocols (developer.mozilla.org/en-US/docs/Web…), она позволяет создавать свои объекты, кот… twitter.com/i/web/status/1…

В обычной жизни я не очень часто создаю такие объекты — как то не приходится. Но, это может быть удобно.

Например, функция range из lodash (та которая создает массив с числами) имеет довольно простой интерфейс (3 аргумен… twitter.com/i/web/status/1…

Эту функцию можно переписать и использовать таким вот образом. pic.twitter.com/xS9958cE0f

Я согласен, разница почти никакой =) Но я же предупредил, что сегодня будут просто размышления о необычном JS-е!

Я не буду сразу рассказывать, как такую функцию написать, чтобы у вас было время развлечься. Присылайте свои решения!

Окей, решение @ottey_xela верное )

А вот мое решение. Наверное, оно не самое элегантное, но какое есть. pic.twitter.com/Rai4OfS36G

Вообще, мне очень нравятся итераторы и генераторы! Однажды у меня была задача получить из API с пагинацией все эле… twitter.com/i/web/status/1…

Мне показалось забавным, что снаружи это можно представить просто как асинхронный интератор —… twitter.com/i/web/status/1…

Очень интересно, что вызывающий код даже не знает в какой момент будет запрошена новая пачка данных, для него кажды… twitter.com/i/web/status/1…

Реализовать такую функцию можно через асинхронные генераторы. Код довольно простой pic.twitter.com/QdxMdrKEgF

Оказывается, что эту функцию можно использовать не только для получения всех элементов, но и для более полезной шту… twitter.com/i/web/status/1…

Любопытно, что обработчик скролла не думает, какими пачками и когда будут загружены посты. Он просто просит следующ… twitter.com/i/web/status/1…

Другая забаваная особенность JS — это внутреннее состояние регулярок. После вызова метода test регулярка запоминает… twitter.com/i/web/status/1…

Какие интересные штуки в JS знаете? 🤣

Бонусный тред на сегодня — книжки, которые нужно прочитать любому разработчику (или разработчице), порядок важен👇

Роберт Мартин, Clean Code: A Handbook of Agile Software Craftsmanship (Чистый код)

Эта книга о хорошем программиро… twitter.com/i/web/status/1…

Джон Сонмез, Soft Skills: The Software Developer’s Life Manual (Путь программиста)

Исчерпывающая инструкция о жизн… twitter.com/i/web/status/1…

Владстон Феррейра Фило, Computer Science Distilled: Learn the Art of Solving Computational Problems

Сложность алго… twitter.com/i/web/status/1…

Роберт Мартин, The Clean Coder: A Code of Conduct for Professional Programmers (Идеальный программист)

Методы, инс… twitter.com/i/web/status/1…

Чад Фаулер, Passionate Programmer (Программист-фанатик)

Сборник практических советов и рекомендаций, касающихся си… twitter.com/i/web/status/1…

Роберт Мартин, Clean Architecture. A Craftsman’s Guide to Software Structure and Design (Чистая архитектура)

Прямы… twitter.com/i/web/status/1…

Брюс Тейт, Seven Languages in Seven Weeks: A Pragmatic Guide to Learning Programming Languages (Семь языков за семь… twitter.com/i/web/status/1…

Джордж Спаффорд, Кевин Бер, The Phoenix Project: A Novel about It, Devops, and Helping Your Business Win (Проект «Ф… twitter.com/i/web/status/1…

Эрик Эванс, Domain-Driven Design: Tackling Complexity in the Heart of Software

Книга рассказывает о систематическо… twitter.com/i/web/status/1…

Это определенно не все хорошие книги, но эти я считаю "масиридами", их нужно прочесть однозначно.

Если хочется поделиться с кем-нибудь этим списком, у меня есть специальная страничка

read.kamyshev.me

На сегодня все🙌

Завтра мне удаляют зуб мудрости, так что не уверен, насколько я буду способен писать штуки в твитт… twitter.com/i/web/status/1…

Кстати, по моим фотографиям вы могли подумать, что тут нет ничего кроме моря. Это не так — у нас есть настоящий гор… twitter.com/i/web/status/1…

О, кстати Type-Driven Development у меня в списке для чтения.

Ладно, кажется, я пережил стоматологические штуки. Только говорить не получается. Здорово, что можно писать в твиттер.

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

Пятничная задачка — это что-то веселое, экспериментальное, полезное для продукта и приятное для разработчика. Поэто… twitter.com/i/web/status/1…

И я хочу, чтобы вы выбрали тему на день 🤓 Я могу рассказать про свои факапы (для которых уже истёк срок НДА), или р… twitter.com/i/web/status/1…

Мне кажется, что надувать щеки и показывать какой ты классный, никогда не факапишь и вообще молодец — глупо. Все ош… twitter.com/i/web/status/1…

Самый старый и самый скучный. Я когда-то делал сайты на PHP за небольшие деньги, и на одном из них была самописная… twitter.com/i/web/status/1…

Соответсвенно, достаточно было угадать имя таблицы с пользователям и можно было вписать туда нового пользователя с… twitter.com/i/web/status/1…

Кстати, никто не заметил, сайт проработал пару лет, контора закрылась, все хорошо.

Любопытно, что потом, через 5 лет я встретил сайт, который делала серьёзная студия с такой же проблемой. Это вообще популярная уязвимость.

Однажды я делал небольшой бекенд на Node.js, в нем был запрос на получение всех записей пользователя. Через пару не… twitter.com/i/web/status/1…

Я очень долго искал проблему, пока не понял, что криво написал запрос через TypeORM, я получал все записи (не тольк… twitter.com/i/web/status/1…

Забавно, что два бага в сумме дали корректно работающую программу и проблему мы заметили только из-за нагрузки на п… twitter.com/i/web/status/1…

Как-то раз я делал сайт, и из-за криворукости переодически приходилось лазить руками в базу, чтобы исправить какие-то проблемки.

База была в контейнере на сервере и в нормальной жизни вообще не торчала наружу — доступ до неё был только внутри локальной сети на сервере.

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

А потом обнаружилось, что на сайте сломалось все — на клиенте любой запрос заканчивался ошибкой 500.

В логах были странные сообщения — схема базы не соответствовала представляем приложения о схеме. Я зашёл в базу, а… twitter.com/i/web/status/1…

Это, пожалуй, был самый страшный факап в моей жизни.

Но, все закончилось плюс-минус хорошо, базу восстановили из бекапа и кажется, заказчик не имел претензий. И, даже,… twitter.com/i/web/status/1…

После следующего факапа я приучил себя читать исходный код используемой библиотеки 😝

Делал приложение, которое должно было поддерживать не самые свежие браузеры (типо ie11). И после очередного релиза… twitter.com/i/web/status/1…

В консоли сообщение, что const — это не понятно. Логично, да.

Оказалось, что одна из библиотек поставлялась в современном js, и мы не бабелили ее, конечно. Исправили быстро, но было неприятно.

С тех пор я топлю за то, чтобы библиотеки ВСЕ поставлялись в виде максимально современного js, а я бы уже сам решил… twitter.com/i/web/status/1…

И тогда же привык смотреть что вообще на зависимость которую я ставлю, читать ее исходные тексты и смотреть, что п… twitter.com/i/web/status/1…

На этом все, простите, но челюсть болит так, что даже сериал смотреть тяжело, не то что писать что-то осмысленно.

Меня все еще мучает зуб (вернее, его отсутствие), но давайте я кратенько расскажу про новые странные веяния фронтендов.

Все вокруг шутят, что в мире фронтенда новый фреймворк появляется каждую неделю. Штош, было бы здорово, но основные… twitter.com/i/web/status/1…

Вебпак 5 не принёс ничего кардинально нового, Реакт 17 вообще вышел из фич. Мейнстримовый фронтенд стагнирует и не… twitter.com/i/web/status/1…

Я, если честно, не верю, что одна из них станет популярной в обозримом будущем, но, мне кажется, что на их основе в… twitter.com/i/web/status/1…

Помните статью про то что фронтенды собираются неадекватно долго? habr.com/ru/company/vds…

Ну правда же очень медленно. Один из моих рабочих проектов на топовом MacBook Pro 13 собирается 160 секунд. А на мо… twitter.com/i/web/status/1…

И с этим ничего не поделать — медленно, долго. Вероятно, эту проблему нельзя решить с помощью JS-тулинга.

Сейчас набирает популярность esbuild (github.com/evanw/esbuild) — это бандлер js написанный на go. И он прямо блейзи… twitter.com/i/web/status/1…

Я пока не пробовал его в бою, только на небольших демо-проектах, но выглядит он впечатляюще.

Кто-нибудь использует esbuild для продакшна?

Другое интересное решение, связанное со сборкой проекта swc (github.com/swc-project/swc) — это компилятор js/ts, напис… twitter.com/i/web/status/1…

Конечно, в нем пока сильно меньше возможностей (swc.rs/docs/compariso…), но для многих проектов они и ненужны.

Следующая интересная штука, это замена nvm, снова написанная на Rust — fnm (github.com/Schniz/fnm). В нем я вижу… twitter.com/i/web/status/1…

RSLint (github.com/RDambrosio016/…) — это как ESLint, только быстро. Меня очень утомляет долгий линтинг большого проек… twitter.com/i/web/status/1…

Пока этот проект совсем сырой (намного сырее первых трёх), но пощупать уже можно.

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

Другая интересная штука — @stenciljs

Это по сути способ писать веб-компоненты, а потом использовать их в приложен… twitter.com/i/web/status/1…

Стейт-менеджеры нового поколения — мой краш: @EffectorJS, recoiljs.org, reatom.js.org. Я совсе… twitter.com/i/web/status/1…

Но после любого пет-проекта на любом из них, возвращаться к написанию логики внутри редакса — жуткая боль.

Так уж получилось, что я живу в Таиланде. И тут есть пара особенностей, относящихся к работе.

Все время, что я тут живу, меня поражают розетки. Везде в Таиланде делают розетки, которые понимают ЛЮБЫЕ вилки.

Все зарядки из России работают, тостер с британской вилкой — работает, местная техника с китайскими вилками — работает.

Ну чудо же! Мечтаю, чтобы во всем мире применили эту тактику.

Зимой 2019 я жил месяц на Кипре. Там британские вилки-розетки и это было довольно неудобно — приходилось использова… twitter.com/i/web/status/1…

Примерно половину года тут низкий сезон — не очень жарко и очень дождливо. В целом кайф, но есть нюанс.

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

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

По очевидными причинам в магазинах продаются компьютеры с тайскими буквами на клавиатуре. Чтобы купить компьютер то… twitter.com/i/web/status/1…

Ну, понятно, с русскими буквами клавиатуру тут достать нельзя. Я сначала очень волновался что будет супер-неудобно, но нет — быстро привык.

Интересно, что даже не привычная по форм-фактору клавиатура айпада без русских букв не вызывает проблем.

Не так сильно относится к работе, но — тут очень хорошая медицина.

Правда довольно дорогая, но правильная страховка покрывает все кейсы. В начале лета надорвал связку в лодыжке. Все… twitter.com/i/web/status/1…

Когда приехал с травмой в больничку, почувствовал себя в фильме — медбрат помог выйти из машины, усадил на кресло-к… twitter.com/i/web/status/1…

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

После наложения гипса отвезли в комнату восстановления — всякие беговые дорожки, тренажеры, небольшая лестница пост… twitter.com/i/web/status/1…

Мне показали два вида костылей, я выбрал одни и меня научили ими пользоваться — нарядили в специальную обвязку, что… twitter.com/i/web/status/1…

А вот с оплатой была беда — сумма за тот день была больше 500 баксов, такие траты страховая не одобряет без согласо… twitter.com/i/web/status/1…

В пятницу ездил удалять зуб мудрости. Это не входит в страховку, я должен был оплатить все сам, поэтому поехал не в… twitter.com/i/web/status/1…

Пару недель назад у меня очередной раз воспалилась восьмерка, я приехал в эту клинику, они сделали рентген-фото, по… twitter.com/i/web/status/1…

В четверг я закончил пить антибиотики, и уже в пятницу приехал удалять зуб. Операцию заняла около часа, больно не б… twitter.com/i/web/status/1…

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

В целом, жить на Пхукете прикольно, но немного раздражает деревенскость. Хочется в город.

Приятный бонус — билеты до Бангкока по 60 баксов. Доехать до аэропорта и потом от аэропорта до дома стоит примерно столько же, кек.

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

О, еще можете подписаться на телеграм-канал специальный

t.me/thai_ecaspates

На этом все 🥳 спасибо вам, было весело.

До вечера ещё готов отвечать на вопросы, ну и если что, пишите в личный ак… twitter.com/i/web/status/1…