Стадия первая: отрицание
После увиденного меня никак не покидает мысль о том, что мир куда-то повернул не туда с этим ESM. Посмотри сам:
* В TS проектах мы пользуемся ESM-like, но в 99% случаев проект коспилируется в CJS.
* Webpack и Vite позволяют нам импортить что угодно и это отбило необходимоть задумываться "а что происходит при импорте?". CJS, ESM, CSS, картинки? Пиши import и не думай. Бандлер сам всё сделает. Ну или хотя бы попытается.
* У нас нет скрипта миграции с CJS на ESM. Мы должны всё делать руками для конвертации проекта в новый стандарт. А делать там дофига чего надо:
-
- module.exports - это объект, а export {} - это кусок синтаксиса. Мы не можем динамику превратить в статику
- module.exports мутабелен. Ты из одной зависимости можешь изменить состояние в другой.
- jest.mock не умеет нормально в ESM. Тут я бы порекомендовал конвертить тесты в Vitest. Там всё ок.
И это только то, что сразу пришло в голову.
Но даже с этим можно было взять стратегию ESLint'a: исправляем то, что можем, об остальном сообщаем. Но и этого нет.
В итоге я прихожу к тому, что sindresorhus сделал всё правильно(https://news.1rj.ru/str/xavescor_code/18), а текущий мир - это помойка, в котором никто не понимает как работают импорты в его проекте. И это прямо неприятно. В итоге мы походу будем всегда жить в мире, где мы пишем не на js/ts, а на Вебпаке, Роллапе или Витесте. Как минимум пока не появится герой, который сможет автоматизировать переход на ESM.
После увиденного меня никак не покидает мысль о том, что мир куда-то повернул не туда с этим ESM. Посмотри сам:
* В TS проектах мы пользуемся ESM-like, но в 99% случаев проект коспилируется в CJS.
* Webpack и Vite позволяют нам импортить что угодно и это отбило необходимоть задумываться "а что происходит при импорте?". CJS, ESM, CSS, картинки? Пиши import и не думай. Бандлер сам всё сделает. Ну или хотя бы попытается.
* У нас нет скрипта миграции с CJS на ESM. Мы должны всё делать руками для конвертации проекта в новый стандарт. А делать там дофига чего надо:
-
require синхронный, из-за чего сделать автозамену на динамический импорт попросту невозможно. Нельзя () => require('lib') превратить в () => await import('lib'). Ты получаешь попросту сломанный код.- module.exports - это объект, а export {} - это кусок синтаксиса. Мы не можем динамику превратить в статику
- module.exports мутабелен. Ты из одной зависимости можешь изменить состояние в другой.
- jest.mock не умеет нормально в ESM. Тут я бы порекомендовал конвертить тесты в Vitest. Там всё ок.
И это только то, что сразу пришло в голову.
Но даже с этим можно было взять стратегию ESLint'a: исправляем то, что можем, об остальном сообщаем. Но и этого нет.
В итоге я прихожу к тому, что sindresorhus сделал всё правильно(https://news.1rj.ru/str/xavescor_code/18), а текущий мир - это помойка, в котором никто не понимает как работают импорты в его проекте. И это прямо неприятно. В итоге мы походу будем всегда жить в мире, где мы пишем не на js/ts, а на Вебпаке, Роллапе или Витесте. Как минимум пока не появится герой, который сможет автоматизировать переход на ESM.
Telegram
Андруша пишет код
Давайте поиграем в игру:
В опенсорс сообществе есть человек, который пилит огромное количество библиотек: https://www.npmjs.com/~sindresorhus
Около двух лет назад он понял, что commonjs мёртв и нужно поддерживать только esm: https://gist.github.com/sind…
В опенсорс сообществе есть человек, который пилит огромное количество библиотек: https://www.npmjs.com/~sindresorhus
Около двух лет назад он понял, что commonjs мёртв и нужно поддерживать только esm: https://gist.github.com/sind…
🔥2💩1
Отношеньки
"Умение работать в команде". Такое требование было практически в каждой вакансии, когда я ориентировался на русскоязычный рынок. Но не соответствовать этому вроде как сложно. Ты же не будешь их игнорить, унижать на встречах, мешать работать? Да, есть люди, которые забиваются в свой угол и пилят фичу по полгода, нигде не отсвечивая, но это исключения. У большинства людей задачи реализуются за дни, максимум за недели. При этом за это время ты или будешь как-то отсвечивать(результатом работы или своими вопросами), или же не работать. Всё просто: эта строка звучит как "нормально делай - нормально будет".
Но что происходит, когда ты выходишь на новую работу? Тут 2 варианта: "всё зашибись" или же "это говно, которое надо переписать с использованием нормальных практик". И вот тут как раз начинается "умение работать в команде".
У меня на текущем проекте:
- нет стейт менеджера(Это в двойне забавнее, потому что я в 2019 писал об этом https://gist.github.com/XaveScor/99431c573b53b8a0c41fb3b5fec522bc)
- нет фиксированного кодстайла. Мы полагаемся на то, что программист сам знает как написать код понятнее
- используются default export, хотя без них жить проще
- нет налаженной документации фич. Часто к разрабам в личку стечатся менеджеры и говорят "поправь быстрее это"
Это всё на бумаге выглядит очень-очень-очень плохо. Но мы имеем поддерживаемый, предсказуемый код. Менеджеры почти всегда нами довольны. У нас в команде нет текучки кадров. И если человек попадает к нам, то он работает года полтора-два как минимум.
И со временем я фразу "Умение работать в команде" начал воспринимать по-другому: команда - это такой же живой организм как и человек. А человек может меняться только в кризисных ситуациях. К примеру: "тебе грозит смерть от одиночества, потому что ты жирдяй". В зоне комфорта же человек меняться никогда не будет.
Точно так же и команда. Все принятые практики в команде работают на достаточном уровне. Да, ты можешь попробовать аргументировать, что текущие практики говно и их надо сменить. Но подобное разобьётся в 99% случаев об "оно работает". И это правда.
Учись работать в команде - не трать время на фигню, потому что куча вещей типа стейт менеджера или кодстайла - это фигня. Лучше заняться чем-то реально полезным, пока текущие "плохие" практики не дадут сбой. А вот в кризисную ситуацию уже что-то можно поменять.
P.S. логика выше не работает для новых проектов. В них ты можешь разгуляться как тебе хочется.
"Умение работать в команде". Такое требование было практически в каждой вакансии, когда я ориентировался на русскоязычный рынок. Но не соответствовать этому вроде как сложно. Ты же не будешь их игнорить, унижать на встречах, мешать работать? Да, есть люди, которые забиваются в свой угол и пилят фичу по полгода, нигде не отсвечивая, но это исключения. У большинства людей задачи реализуются за дни, максимум за недели. При этом за это время ты или будешь как-то отсвечивать(результатом работы или своими вопросами), или же не работать. Всё просто: эта строка звучит как "нормально делай - нормально будет".
Но что происходит, когда ты выходишь на новую работу? Тут 2 варианта: "всё зашибись" или же "это говно, которое надо переписать с использованием нормальных практик". И вот тут как раз начинается "умение работать в команде".
У меня на текущем проекте:
- нет стейт менеджера(Это в двойне забавнее, потому что я в 2019 писал об этом https://gist.github.com/XaveScor/99431c573b53b8a0c41fb3b5fec522bc)
- нет фиксированного кодстайла. Мы полагаемся на то, что программист сам знает как написать код понятнее
- используются default export, хотя без них жить проще
- нет налаженной документации фич. Часто к разрабам в личку стечатся менеджеры и говорят "поправь быстрее это"
Это всё на бумаге выглядит очень-очень-очень плохо. Но мы имеем поддерживаемый, предсказуемый код. Менеджеры почти всегда нами довольны. У нас в команде нет текучки кадров. И если человек попадает к нам, то он работает года полтора-два как минимум.
И со временем я фразу "Умение работать в команде" начал воспринимать по-другому: команда - это такой же живой организм как и человек. А человек может меняться только в кризисных ситуациях. К примеру: "тебе грозит смерть от одиночества, потому что ты жирдяй". В зоне комфорта же человек меняться никогда не будет.
Точно так же и команда. Все принятые практики в команде работают на достаточном уровне. Да, ты можешь попробовать аргументировать, что текущие практики говно и их надо сменить. Но подобное разобьётся в 99% случаев об "оно работает". И это правда.
Учись работать в команде - не трать время на фигню, потому что куча вещей типа стейт менеджера или кодстайла - это фигня. Лучше заняться чем-то реально полезным, пока текущие "плохие" практики не дадут сбой. А вот в кризисную ситуацию уже что-то можно поменять.
P.S. логика выше не работает для новых проектов. В них ты можешь разгуляться как тебе хочется.
Gist
Context vs StateManager
Context vs StateManager. GitHub Gist: instantly share code, notes, and snippets.
👍7
Раз комментарии работают, то вот сам шпаргалка по http кодам, если забываете их. https://http.cat
HTTP Status Cats API
HTTP Cats
API for HTTP Cats
🔥3
Не трожь пока работает
Почти всегда эта фраза верна. Не стоит тратить силы на то, что не нужно. Но не всегда.
Недавно я решил форкнуть gulp, так как мне нравится их подход, но не устраивает что проект заброшен уже года 4. И походу ребята перегорели уже тогда, так как проект в v4 не развивался, а пытался создать видимость отсутсвия багов: https://github.com/XaveScor/gulp/issues/10.
Мне кажется, что люди понимали, что им лень заниматься проектом, поэтому просто вставили затычку. Не более.
Вывод из этого для меня прост: если используется старая зависимость в активно развивающемся проекте, то "работаешь - не трожь" не применимо. Все элементы вашего проекта должны быть поддерживаемыми. Иначе может оказаться, что вы используете на отвали написанный код.
P.S. если вы у себя внезапно всё ещё используете галп почему-то, то можете перейти на https://www.npmjs.com/package/@xavescor/gulp. Я постараюсь не сломать обратную совместимость и развивать проект.
Почти всегда эта фраза верна. Не стоит тратить силы на то, что не нужно. Но не всегда.
Недавно я решил форкнуть gulp, так как мне нравится их подход, но не устраивает что проект заброшен уже года 4. И походу ребята перегорели уже тогда, так как проект в v4 не развивался, а пытался создать видимость отсутсвия багов: https://github.com/XaveScor/gulp/issues/10.
Мне кажется, что люди понимали, что им лень заниматься проектом, поэтому просто вставили затычку. Не более.
Вывод из этого для меня прост: если используется старая зависимость в активно развивающемся проекте, то "работаешь - не трожь" не применимо. Все элементы вашего проекта должны быть поддерживаемыми. Иначе может оказаться, что вы используете на отвали написанный код.
P.S. если вы у себя внезапно всё ещё используете галп почему-то, то можете перейти на https://www.npmjs.com/package/@xavescor/gulp. Я постараюсь не сломать обратную совместимость и развивать проект.
GitHub
The task didn't run once · Issue #10 · XaveScor/gulp
These tests skipped in the original Undertaker: https://github.com/gulpjs/undertaker/blob/e255fc7c9be27d11dc8a711a3f15e058040e712c/test/integration.js#L78-L127 Failed tests inside this repo: gulp/s...
Отношеньки pt2
https://news.1rj.ru/str/xavescor_code/30
Предположим что вы установили какие-то правила по написанию кода. К примеру, у нас в команде мы решили что использовать React.useCallback - не очень хорошая идея и мы написали ему замену. Но есть проблема: как донести идею до команды и контролировать её соблюдение? Потому что у людей есть проблема: они забывают. А тратить время на code review каждый раз, чтобы проверять использует ли человек что-то не то - очень сильно напрягает.
Решение простое: ESLint. Если вы установили какое-то правило - оно должно покрываться линтером. Правило сверху, к примеру, можно покрыть кодом, который изображён на скриншотах выше.
Из этого я пришёл к следующему правилу в отношеньках: если вы сумели согласиться на какую-либо практику, то она ОБЯЗАНА покрываться линтером. Да, есть мелкие исключения, но они мелкие. Остальные правила должны быть в линте.
Из этого следует второе правило: при ревью не принимаются притензии по кодстайлу, используемым апишкам и т.п. Потому что если это плохо, то подобный код должен запрещаться линтером.
Уважайте время коллег: как при написании кода, так и при ревью. Потому что неформализованные правила - это самое большое зло, которое ведёт к конфликтам.
Полезные ссылки:
https://eslint.org/docs/latest/rules/no-restricted-syntax - запрет написания плохого кода
https://eslint.org/docs/latest/rules/no-restricted-imports - запрет импортов
https://astexplorer.net - посмотреть в какой ast превращается ваш код для правил выше
https://news.1rj.ru/str/xavescor_code/30
Учись работать в команде - не трать время на фигнюПредположим что вы установили какие-то правила по написанию кода. К примеру, у нас в команде мы решили что использовать React.useCallback - не очень хорошая идея и мы написали ему замену. Но есть проблема: как донести идею до команды и контролировать её соблюдение? Потому что у людей есть проблема: они забывают. А тратить время на code review каждый раз, чтобы проверять использует ли человек что-то не то - очень сильно напрягает.
Решение простое: ESLint. Если вы установили какое-то правило - оно должно покрываться линтером. Правило сверху, к примеру, можно покрыть кодом, который изображён на скриншотах выше.
Из этого я пришёл к следующему правилу в отношеньках: если вы сумели согласиться на какую-либо практику, то она ОБЯЗАНА покрываться линтером. Да, есть мелкие исключения, но они мелкие. Остальные правила должны быть в линте.
Из этого следует второе правило: при ревью не принимаются притензии по кодстайлу, используемым апишкам и т.п. Потому что если это плохо, то подобный код должен запрещаться линтером.
Уважайте время коллег: как при написании кода, так и при ревью. Потому что неформализованные правила - это самое большое зло, которое ведёт к конфликтам.
Полезные ссылки:
https://eslint.org/docs/latest/rules/no-restricted-syntax - запрет написания плохого кода
https://eslint.org/docs/latest/rules/no-restricted-imports - запрет импортов
https://astexplorer.net - посмотреть в какой ast превращается ваш код для правил выше
Telegram
Андруша пишет код
Отношеньки
"Умение работать в команде". Такое требование было практически в каждой вакансии, когда я ориентировался на русскоязычный рынок. Но не соответствовать этому вроде как сложно. Ты же не будешь их игнорить, унижать на встречах, мешать работать? Да…
"Умение работать в команде". Такое требование было практически в каждой вакансии, когда я ориентировался на русскоязычный рынок. Но не соответствовать этому вроде как сложно. Ты же не будешь их игнорить, унижать на встречах, мешать работать? Да…
🔥4
Андруша пишет код
Отношеньки pt2 https://news.1rj.ru/str/xavescor_code/30 Учись работать в команде - не трать время на фигню Предположим что вы установили какие-то правила по написанию кода. К примеру, у нас в команде мы решили что использовать React.useCallback - не очень хорошая идея…
Предположим, что вы сумели договориться и написали правило, которое запрещает писать тот или иной код. Но как это внедрить?
Есть пакет https://github.com/amanda-mitchell/suppress-eslint-errors, который расставит eslint-ignore в нужных местах. В итоге у вас будет и CI зелёный, и новый код будет уже правильным и красивым. А старый вы постепенно переработаете в процессе будущих задач.
Есть пакет https://github.com/amanda-mitchell/suppress-eslint-errors, который расставит eslint-ignore в нужных местах. В итоге у вас будет и CI зелёный, и новый код будет уже правильным и красивым. А старый вы постепенно переработаете в процессе будущих задач.
GitHub
GitHub - amanda-mitchell/suppress-eslint-errors: Suppress existing violations of new eslint rules and get back to building stuff.
Suppress existing violations of new eslint rules and get back to building stuff. - amanda-mitchell/suppress-eslint-errors
🔥3❤1
Когда у меня в очередной раз отваливается сафари с утечкой памяти на ютубе мне всегда хочется посмотреть на тех людей, кто говорит, что фронт - это просто и любая макака справится.
Походу в гугле только макаки и работают.
Для воспроизведения достаточно открыть на одной и той же вкладке эдак 50 видео. К примеру, послушать музыку у плейлисте или же полистать шортсы.
Из полезного: думайте над утечками памяти через глобальные ресурсы. К примеру, setInterval полезно закрывать всегда.
Походу в гугле только макаки и работают.
Для воспроизведения достаточно открыть на одной и той же вкладке эдак 50 видео. К примеру, послушать музыку у плейлисте или же полистать шортсы.
Из полезного: думайте над утечками памяти через глобальные ресурсы. К примеру, setInterval полезно закрывать всегда.
🔥5
Анналы
Slack, github/gitlab/jira issues популяризировали идею того, что сообщения - это и есть документация к коду. Но почему-то люди с одной стороны поддерживают это, а с другой стороны наплевательски относятся к этому.
Как делать плохо: https://github.com/XaveScor/gulp/blob/master/index.js#L5
Как делать хорошо: https://github.com/XaveScor/gulp/blob/d90d9476e64e5c684f18e832529d7ac472b028a9/index.js#L5
Хеш, который находится в урле - это важная вещь, потому что имена веток протухают, так как их HEAD блуждает по коммитам, а хеши постоянны(почти. Увы, гитхаб 1 раз менял их генерацию).
Как воспользоваться?
- На странице гитхаба, которую хотите расшарить нажмите `y`(латинская) и у вас в урле будет урл с хешем коммита.
- Для IDE от JetBrains можно поставить крутой плагин https://plugins.jetbrains.com/plugin/8183-gitlink, который позволяет копировать ссылки на кучу сервисов(github, gitlab, bitbucket, etc) прямо из IDE
Slack, github/gitlab/jira issues популяризировали идею того, что сообщения - это и есть документация к коду. Но почему-то люди с одной стороны поддерживают это, а с другой стороны наплевательски относятся к этому.
Как делать плохо: https://github.com/XaveScor/gulp/blob/master/index.js#L5
Как делать хорошо: https://github.com/XaveScor/gulp/blob/d90d9476e64e5c684f18e832529d7ac472b028a9/index.js#L5
Хеш, который находится в урле - это важная вещь, потому что имена веток протухают, так как их HEAD блуждает по коммитам, а хеши постоянны(почти. Увы, гитхаб 1 раз менял их генерацию).
Как воспользоваться?
- На странице гитхаба, которую хотите расшарить нажмите `y`(латинская) и у вас в урле будет урл с хешем коммита.
- Для IDE от JetBrains можно поставить крутой плагин https://plugins.jetbrains.com/plugin/8183-gitlink, который позволяет копировать ссылки на кучу сервисов(github, gitlab, bitbucket, etc) прямо из IDE
GitHub
gulp/index.js at master · XaveScor/gulp
A toolkit to automate & enhance your workflow. Contribute to XaveScor/gulp development by creating an account on GitHub.
🔥1🤮1
Как воспользоваться?
- На странице гитхаба, которую хотите расшарить нажмите `y`(латинская) и у вас в урле будет урл с хешем коммита.
- Для IDE от JetBrains можно поставить крутой плагин https://plugins.jetbrains.com/plugin/8183-gitlink, который позволяет копировать ссылки на кучу сервисов(github, gitlab, bitbucket, etc) прямо из IDE
- Для VSCode сорян, не использую, но уверен, что есть аналог.
Делайте свои ссылки постоянными, чтобы через полгода-год-два вы могли понять куда вы ссылались.
- На странице гитхаба, которую хотите расшарить нажмите `y`(латинская) и у вас в урле будет урл с хешем коммита.
- Для IDE от JetBrains можно поставить крутой плагин https://plugins.jetbrains.com/plugin/8183-gitlink, который позволяет копировать ссылки на кучу сервисов(github, gitlab, bitbucket, etc) прямо из IDE
- Для VSCode сорян, не использую, но уверен, что есть аналог.
Делайте свои ссылки постоянными, чтобы через полгода-год-два вы могли понять куда вы ссылались.
👍3🤮1
Никогда, НИКОГДА, НИ-КАГ-ДА не называйте переменные именами апих из глобального скоупа.
Сегодня я потратил часов 5 выясняя из стектрейса на 2 страницы(Не стебусь, реально 2) почему у меня в fetch нет метода catch.
Угадали? Верно, потому что fetch - это имя переменной, а не функция из globalThis. Вот зла не хватает, когда подобное видишь.
Назови человек переменную fetchFx, я бы не перелопачивал исходники jsdom и ещё 3 библитек, которые используются в тестах.
Поберегите психическое здоровье своих коллег из команды. Они знают где вы живёте.
Сегодня я потратил часов 5 выясняя из стектрейса на 2 страницы(Не стебусь, реально 2) почему у меня в fetch нет метода catch.
Угадали? Верно, потому что fetch - это имя переменной, а не функция из globalThis. Вот зла не хватает, когда подобное видишь.
Назови человек переменную fetchFx, я бы не перелопачивал исходники jsdom и ещё 3 библитек, которые используются в тестах.
Поберегите психическое здоровье своих коллег из команды. Они знают где вы живёте.
😁14❤1👍1🤬1🤮1
Не думай о хорошем
Прошла неделя с момента кривого ютуба(https://news.1rj.ru/str/xavescor_code/44) и я начинаю подозревать, что мартышки повсюду. Потому что зачем планировать то как код будет работать в нештатной ситуации? Внезапно, код может упасть или ещё что-то подобное. К примеру, еикто в тестах не думает насколько удобно работать с упавшим тестом. А поэтому никто не чистит за собой ресурсы.
Если вы в тестах не пишите
при работе с ресурсами, то у вас проблемы. Потому что иначе у вас ресурсы будут утекать. Есть, конечно, https://github.com/tc39/proposal-explicit-resource-management, но когда оно появится?
Прошла неделя с момента кривого ютуба(https://news.1rj.ru/str/xavescor_code/44) и я начинаю подозревать, что мартышки повсюду. Потому что зачем планировать то как код будет работать в нештатной ситуации? Внезапно, код может упасть или ещё что-то подобное. К примеру, еикто в тестах не думает насколько удобно работать с упавшим тестом. А поэтому никто не чистит за собой ресурсы.
Если вы в тестах не пишите
const finalizers = [];
try {
doSmth();
} finally {
finalizers.forEach(f => f());
}
при работе с ресурсами, то у вас проблемы. Потому что иначе у вас ресурсы будут утекать. Есть, конечно, https://github.com/tc39/proposal-explicit-resource-management, но когда оно появится?
Telegram
Андруша пишет код
Когда у меня в очередной раз отваливается сафари с утечкой памяти на ютубе мне всегда хочется посмотреть на тех людей, кто говорит, что фронт - это просто и любая макака справится.
Походу в гугле только макаки и работают.
Для воспроизведения достаточно…
Походу в гугле только макаки и работают.
Для воспроизведения достаточно…
👍2
За последние 3 дня я столкнулся с двумя ситуациями:
- gulp.watch - штука которая смотрит за ФС, но, внезапно, криво размонтируется в тестах. Из-за чего в 3 из 4 случаев у меня тесты падают в случайном месте. Просто из-за кривого размонтирования. Никогда не чистите так за собой. https://github.com/XaveScor/gulp/blob/dad4fde180bdeeaa8da0de9c8cd3598af97ea67b/test/watch.mjs#L44
- Работа с сетью - аналогичная штука. Но тут ситуация серьёзнее. Из-за того что некоторые веб сервисы могут быть недоступны, то приходится навешивать retry. Из-за чего при падении теста код не доходит до освобождения ресурсов и на всё время прогонки тестов я получаю утечку. Из-за чего тесты опять же выпадают в ООМ или в другую ошибку.
Не будь макакой - думай и о плохом.
- gulp.watch - штука которая смотрит за ФС, но, внезапно, криво размонтируется в тестах. Из-за чего в 3 из 4 случаев у меня тесты падают в случайном месте. Просто из-за кривого размонтирования. Никогда не чистите так за собой. https://github.com/XaveScor/gulp/blob/dad4fde180bdeeaa8da0de9c8cd3598af97ea67b/test/watch.mjs#L44
- Работа с сетью - аналогичная штука. Но тут ситуация серьёзнее. Из-за того что некоторые веб сервисы могут быть недоступны, то приходится навешивать retry. Из-за чего при падении теста код не доходит до освобождения ресурсов и на всё время прогонки тестов я получаю утечку. Из-за чего тесты опять же выпадают в ООМ или в другую ошибку.
Не будь макакой - думай и о плохом.
👍2