Уже несколько лет пользуюсь @trivago/prettier-plugin-sort-imports для быстрой сортировки импортов через prettier.
В какой-то момент убрали лишнюю зависимость от @vue/compiler-sfc, пользоваться стало совсем приятно.
Вот мой конфиг, который обычно переношу из проекта в проект.
В какой-то момент убрали лишнюю зависимость от @vue/compiler-sfc, пользоваться стало совсем приятно.
Вот мой конфиг, который обычно переношу из проекта в проект.
{
"printWidth": 120,
"tabWidth": 2,
"useTabs": false,
"semi": true,
"trailingComma": "all",
"bracketSpacing": true,
"plugins": ["@trivago/prettier-plugin-sort-imports"],
"importOrderGroupNamespaceSpecifiers": true,
"importOrderParserPlugins": ["typescript", "jsx"],
"importOrderSortSpecifiers": true,
"importOrderSeparation": true,
"importOrder": [
"<THIRD_PARTY_MODULES>",
"^@/app(.*)$",
"^@/pages(.*)$",
"^@/layouts(.*)$",
"^@/widgets(.*)$",
"^@/features(.*)$",
"^@/entities(.*)$",
"^@/shared(.*)$",
"^[../]",
"^[./]"
]
}
1🔥43👍21❤5
А вот совсем недавно обнаружил форк, который добавляет еще несколько опций поверх плагина от Trivago.
https://github.com/ianvs/prettier-plugin-sort-imports
1. Добавляет специальные группы
2. Возможность разделять группы через
Но вот этих опций нет
И если с
Тестирую с этим конфигом:
https://github.com/ianvs/prettier-plugin-sort-imports
1. Добавляет специальные группы
<BUILTIN_MODULES> и <TYPES>;2. Возможность разделять группы через
"";Но вот этих опций нет
"importOrderSortSpecifiers": true,
"importOrderSeparation": true,
И если с
order separation всё понятно, теперь добавляем "" и живём, то вот с sort specifiers пока непонятно.Тестирую с этим конфигом:
{
"printWidth": 120,
"tabWidth": 2,
"useTabs": false,
"semi": true,
"trailingComma": "all",
"bracketSpacing": true,
"plugins": ["@ianvs/prettier-plugin-sort-imports"],
"importOrder": [
"<BUILTIN_MODULES>",
"<THIRD_PARTY_MODULES>",
"",
"^@/app(.*)$",
"^@/pages(.*)$",
"^@/layouts(.*)$",
"^@/widgets(.*)$",
"^@/features(.*)$",
"^@/entities(.*)$",
"^@/shared(.*)$",
"",
"^[../]",
"^[./]"
],
"importOrderParserPlugins": ["typescript", "jsx"],
"importOrderTypeScriptVersion": "5.0.0",
"importOrderCaseSensitive": false
}
1👍12❤2
Много лет пользовался husky + lint-staged, недавно во время подготовки тестового задания попробовал lefthook.
Во первых, приятно, что он заменяет собой сразу две зависимости.
Во вторых, простой, но при этом супер гибкий в настройке.
Ну и наконец, в CLI приятно выглядит, просто как бонус.
Во первых, приятно, что он заменяет собой сразу две зависимости.
Во вторых, простой, но при этом супер гибкий в настройке.
Ну и наконец, в CLI приятно выглядит, просто как бонус.
pre-push:
jobs:
- name: packages audit
run: pnpm audit
- name: build
run: pnpm build
pre-commit:
commands:
eslint:
run: pnpm eslint {staged_files} --fix
glob: "*.{js,ts,jsx,tsx}"
stage_fixed: true
prettier:
run: pnpm prettier --write {staged_files}
glob: "*.{js,ts,jsx,tsx,css,html,json}"
stage_fixed: true
1🔥33👍14❤2
А оказывается, Node.js 24 поддерживает синтаксис
Что позволяет сделать даже логи проще и приятнее.
Когда
Хоть изначально предназначено для очистки ресурсов, но здесь хорошо работает
https://github.com/tc39/proposal-explicit-resource-management
usingЧто позволяет сделать даже логи проще и приятнее.
Когда
mainGroup выйдет из скоупа (функция, if, for или {}), автоматически будет вызвана функция [Symbol.dispose]Хоть изначально предназначено для очистки ресурсов, но здесь хорошо работает
https://github.com/tc39/proposal-explicit-resource-management
🔥35💅6✍4 4❤1
Плавный переезд Vite на Rolldown
https://voidzero.dev/posts/announcing-rolldown-vite
Ещё один инструмент фронтендеров уходит с JavaScript runtime на Rust.
С одной стороны это обосновано, там какие-то нереальные цифры профита по производительности и по памяти, а с другой уходят не полностью.
Нельзя просто так взять и отказаться от огромной экосистемы JavaScript-плагинов Rollup — в сборщике есть JavaScript движок, чтобы их запускать.
Меня радует, что авторы обещают отсутствие мажорных отличий. Конечно, для популярных плагинов/фреймворков этот переезд не критичен — баги быстро пофиксят, а критичные места можно покрыть через
А вот для кастомных плагинов, если они у вас есть, может возникнуть проблема. Поэтому лично я начну тестировать rolldown-vite на своих проектах уже в ближайшее время.
Благо это крайне легко:
https://voidzero.dev/posts/announcing-rolldown-vite
Ещё один инструмент фронтендеров уходит с JavaScript runtime на Rust.
С одной стороны это обосновано, там какие-то нереальные цифры профита по производительности и по памяти, а с другой уходят не полностью.
Нельзя просто так взять и отказаться от огромной экосистемы JavaScript-плагинов Rollup — в сборщике есть JavaScript движок, чтобы их запускать.
Меня радует, что авторы обещают отсутствие мажорных отличий. Конечно, для популярных плагинов/фреймворков этот переезд не критичен — баги быстро пофиксят, а критичные места можно покрыть через
if(vite.rolldownVersion)А вот для кастомных плагинов, если они у вас есть, может возникнуть проблема. Поэтому лично я начну тестировать rolldown-vite на своих проектах уже в ближайшее время.
Благо это крайне легко:
{
"pnpm": {
"overrides": {
"vite": "npm:rolldown-vite@latest"
}
}
}🔥12👍4❤3
Forwarded from Dev News от Максима Соснова
Ecma International approves ECMAScript 2025: What’s new?
25 июня зафиксировали стандарт ECMAScript 2025.
Что зафиксировали: импорт-атрибуты (нужны для JSON-модулей), хелперы для итераторов, новые методы Set, немного улучшили RegExp, добавили
Import attributes
Добавили в язык возможность импортировать не JS код. Для этого понадобилось добавлять синтаксис, который бы объяснял движку или рантайму, что сейчас будет импорчено
Хелперы для итераторов
Для массивов есть удобные методы, а для итераторов - нет. Решили исправить эту несправедливость и перенесли часть методов на итераторы
Адаптированные для итератора методы
-
-
-
-
-
-
-
-
Также сделали аналоги
-
-
Еще сделали удобный метод для преобразования итератора в массив
Новые методы Set
- Создание нового сета из двух существующих:
-
-
-
-
- Определение отношения наборов:
-
-
-
Улучшения RegExp
Флаги теперь можно применять не ко всему RegExp, а к отдельным группам
Можно использовать одинаковые имена для групп
Promise.try
Если функция
Работа с 16-битными числами
По дефолту числа в JS представлены 64-битными числами с плавающей точкой. Но есть кейсы, когда необходимо вести все вычисления в 16 или 32-битных числах. В JS добавили разные хелперы для работы с такими числами, например
https://2ality.com/2025/06/ecmascript-2025.html
#development #javascript #ecmascript #releaseNotes
25 июня зафиксировали стандарт ECMAScript 2025.
Что зафиксировали: импорт-атрибуты (нужны для JSON-модулей), хелперы для итераторов, новые методы Set, немного улучшили RegExp, добавили
Promise.try и поддержки 16-битных чисел с плавающей точкойImport attributes
Добавили в язык возможность импортировать не JS код. Для этого понадобилось добавлять синтаксис, который бы объяснял движку или рантайму, что сейчас будет импорчено
import configData1 from './config-data.json' with { type: 'json' };
// Dynamic import
const configData2 = await import(
'./config-data.json', { with: { type: 'json' } }
);
Хелперы для итераторов
Для массивов есть удобные методы, а для итераторов - нет. Решили исправить эту несправедливость и перенесли часть методов на итераторы
const arr = ['a', '', 'b', '', 'c', '', 'd', '', 'e'];
assert.deepEqual(
arr.values() // creates an iterator
.filter(x => x.length > 0)
.drop(1)
.take(3)
.map(x => `=${x}=`)
.toArray()
,
['=b=', '=c=', '=d=']
);
Адаптированные для итератора методы
-
iterator.filter(filterFn)-
iterator.map(mapFn)-
iterator.flatMap(mapFn)-
iterator.some(fn)-
iterator.every(fn)-
iterator.find(fn)-
iterator.reduce(reducer, initialValue?)-
iterator.forEach(fn)Также сделали аналоги
slice-
iterator.drop(limit) возвращает новый итератор без первых limit значений (по сути slice(limit))-
iterator.take(limit) возвращает новый итератор с первыми limit значениями (по сути slice(0, limit))Еще сделали удобный метод для преобразования итератора в массив
iterator.toArray()Новые методы Set
- Создание нового сета из двух существующих:
-
Set.prototype.intersection(other) - пересечение - только те значения, которые есть в обоих наборах-
Set.prototype.union(other) - объединение - значение из обоих наборов-
Set.prototype.difference(other) - позволяет достать множество, которое получится если из множества А убрать все элементы множества Б -
Set.prototype.symmetricDifference(other) - позволяет достать множество, которое содержит элементы которые входят только в одно из множеств- Определение отношения наборов:
-
Set.prototype.isSubsetOf(other) - является ли набор А - подмножеством набора Б-
Set.prototype.isSupersetOf(other) является ли набор А - надмножеством набора Б-
Set.prototype.isDisjointFrom(other) - возвращает true, если у множеств нет пересеченийassert.deepEqual(
new Set(['a', 'b', 'c']).union(new Set(['b', 'c', 'd'])),
new Set(['a', 'b', 'c', 'd'])
);
assert.deepEqual(
new Set(['a', 'b', 'c']).intersection(new Set(['b', 'c', 'd'])),
new Set(['b', 'c'])
);
assert.deepEqual(
new Set(['a', 'b']).isSubsetOf(new Set(['a', 'b', 'c'])),
true
);
assert.deepEqual(
new Set(['a', 'b', 'c']).isSupersetOf(new Set(['a', 'b'])),
true
);
Улучшения RegExp
RegExp.escape(text) позволяет вставить текст в RegExp и быть уверенным, что вставленный текст не сломает RegExpconst regExp = new RegExp(
`(?<!“)${RegExp.escape(text)}(?!”)`,
'gu'
);
Флаги теперь можно применять не ко всему RegExp, а к отдельным группам
/^x(?i:HELLO)x$/.test('xHELLOx') // true
Можно использовать одинаковые имена для групп
const RE = /(?<chars>a+)|(?<chars>b+)/v;
Promise.try
Promise.try немного упрощает создание промиса с синхронными функциями return Promise.try(() => {
const value = syncFuncMightThrow();
return asyncFunc(value);
});
Если функция
syncFuncMightThrow бросит исключение, то Promise.try вернет реджектнутый промис.Работа с 16-битными числами
По дефолту числа в JS представлены 64-битными числами с плавающей точкой. Но есть кейсы, когда необходимо вести все вычисления в 16 или 32-битных числах. В JS добавили разные хелперы для работы с такими числами, например
Math.f16round делает округление в пространстве 16-битных чиселconsole.log(Math.f16round(2**16)) // Infinity
console.log(2**16) // 65536
https://2ality.com/2025/06/ecmascript-2025.html
#development #javascript #ecmascript #releaseNotes
2Ality
Ecma International approves ECMAScript 2025: What’s new?
On 25 June 2025, the 129th Ecma General Assembly approved the ECMAScript 2025 language specification (press release, GitHub release), which means that it’s officially a standard now. This blog post explains what’s new.
🔥33❤4 2👍1
По какому поводу стоит писать в личку:
1. любые вопросы про frontend.vision
2. запросить разъяснения интересующей темы (это будет пост в канале)
3. попросить консультацию
4. что-то рандомное, не являющееся рекламой и не входящее в категории выше
1. любые вопросы про frontend.vision
2. запросить разъяснения интересующей темы (это будет пост в канале)
3. попросить консультацию
4. что-то рандомное, не являющееся рекламой и не входящее в категории выше
👍12😁1
Forwarded from Effector news (Дима Zerꙫbias)
effector 23.4.0
Babel/SWC plugin
- Добавлена поддержка hmr. Большое спасибо @movpushmov и @kireevmp за реализацию 🔥
- Добавлена поддержка опции transformLegacyDomainMethods для выключения трансформации методов доменов
- Добавлена опция forceScope чтобы проставлять forceScope в реакт-хуки автоматически
- Пакет effector-action добавлен в дефолтные factories
- Добавлена поддержка tagged template фабрик (например как patronum format)
Типизация
- Исправлен ряд проблем в типах split. Огромное спасибо @den_churbanov за то что улучшил эти необъятные типы 💪
- Добавлена пропущенная опция
Рантайм
- Улучшена поддержка поля
Babel/SWC plugin
- Добавлена поддержка hmr. Большое спасибо @movpushmov и @kireevmp за реализацию 🔥
- Добавлена поддержка опции transformLegacyDomainMethods для выключения трансформации методов доменов
- Добавлена опция forceScope чтобы проставлять forceScope в реакт-хуки автоматически
- Пакет effector-action добавлен в дефолтные factories
- Добавлена поддержка tagged template фабрик (например как patronum format)
Типизация
- Исправлен ряд проблем в типах split. Огромное спасибо @den_churbanov за то что улучшил эти необъятные типы 💪
- Добавлена пропущенная опция
skipVoid для domain.createStoreРантайм
- Улучшена поддержка поля
name в sample, теперь его можно задавать в любых сэмплах и видеть имя связи в patronum debug с опцией traceGitHub
Release effector Atlas 23.4.0 · effector/effector
Babel/SWC plugin
Add support for hmr. Big thanks to @movpushmov and @kireevmp
Add support for transformLegacyDomainMethods option (PR #1059)
Add forceScope option (PR #1002)
Add effector-action to...
Add support for hmr. Big thanks to @movpushmov and @kireevmp
Add support for transformLegacyDomainMethods option (PR #1059)
Add forceScope option (PR #1002)
Add effector-action to...
1🔥10 6❤2👎2😐1
This media is not supported in your browser
VIEW IN TELEGRAM
Вроде неплохая библиотека частиц… но так лагает
🤩15😁11 6😢3👍2
Устанавливаю Zen браузер
Далее Zed редактор
И не забываем про Zod валидатор
Какие еще тулзы Z* остались?
Далее Zed редактор
И не забываем про Zod валидатор
Какие еще тулзы Z* остались?
😁31👎8🔥6❤3😡3
Итак, представим.
Вы делаете продукт, он приносит деньги в начале, затем, вы много занимаетесь работой, жизнью, потом поиском работы и в процессе устаете от ответственности, которую сами же на себя возложили.
Выгораете
Что дальше? Как продолжать?
Вы делаете продукт, он приносит деньги в начале, затем, вы много занимаетесь работой, жизнью, потом поиском работы и в процессе устаете от ответственности, которую сами же на себя возложили.
Выгораете
Что дальше? Как продолжать?
😢20 5❤1
Forwarded from Dev News от Максима Соснова
Expert Generalists
Статья в блоге Мартина Фаулера про T-shaped специалистов. Точнее, все текущие термины (T-shape, П-shape, и другие) плохо подходят, поэтому в статье вводится термин Expert-Generalist, который означает, что человек одновременно является и экспертом (в противовес generalist) и использует свою экспертизу во многих областях (в противовес эксперту в одной области).
В данном случае имеется в виду, что человек является экспертом в фундаментальных понятиях, которые позволяют ему быть успешным в областях, которые построены на этих понятиях. Классический пример из IT, это когда человек имеет опыт написания ПО на 3-4 языка программирования и ему после этого уже не так важно, на каком именно другом языке писать код, пока этот язык следует общим парадигмам (основан на том же фундаменте). Условно, человек, который писал на JS, PHP, JAVA, C++ с легкостью может войти в Go, Rust, Kotlin. Но, вероятно, столкнется с некоторыми проблемами при входе в Haskell. Но, скорее всего, сможет это сделать в короткие сроки.
В профессиональных кругах не любят генералистов, т.к. у них нет глубоких знаний ни в одной из зон.
В этом кроется ключевая разница между генералистами и экспертами-генералистами. Чистые генералисты знают все поверхностно. Эксперты-генералисты - знают фундаментальные принципы, знание которых позволяет им погружаться в смежные области
В чем сила таких специалистов:
Как правило, такие люди быстро обучаются - они изучат новый инструментарий, если он решает текущую задачу. Как следствие, они создадут более лучшее решение за счет подходящих инструментариев.
Эксперты-генералисты должны иметь хорошие навыки коммуникации и совместной работы. Т.к. они не являются экспертами в областях, они должны уметь запрашивать помощь у коллег. Понимание основных принципов помогает им быстро погружаться в контексты специалистов
Эксперты-генералисты игнорируют барьеру между отделами, командами, функциями. Это те люди, которые могут ускорить выполнение проекта т.к. для них не существует барьеров и, как следствие, они ускоряют коммуникацию, которая необходима для решения задачи
Ключевые качества экспертов-генералистов:
- Любознательность
- Умение сотрудничать
- Фокус на клиенте (бизнесовая направленность)
- Ставка на фундаментальные знания
- Широта знаний
- Способность понимать позицию смежных доменов (например, понимать проблемы SRE или DevOps)
Многие эксперты-генералисты вырастают в технических лидеров
Встает закономерны вопрос: "где брать таких специалистов?". Текущий найм устроен так, что мы скорее наймем ультра-эксперта в технологии, чем наймем человека, который любознателен и умеет погружаться в новые домены. В статье предлагается подход из двух решений:
- Перестать смотреть только на узкие хард-скилы. Вместо этого следует проверять человека на обучаемость, любознательность, создание условий для совместной работы
- Проводить внутренние тренинги и воркшопы, цель которых - погрузить специалистов в смежные области. В Thoughtworks есть 3 воркшопа, в которых специалисты делают решения из смежных областей. В рамках воркшопа они реализуют простые прототипы kafka, kubernetes, delta lake (штука для работы с данными). Создав прототип, люди начинают понимать базовые принципы, на которых основаны эти системы и начинают видеть рабочие ситуации с другой стороны
Это не означает, что больше не нужны специалисты, которые глубоко погружены в какую-то область знаний. Они, конечно же, нужны. В идеале в команде нужны и генералисты и специалисты. Специалисты в этом сетапе:
- Обучают генералистов, подсказывают им какие-то неочевидные нюансы, потеря которых сильно ухудшит решение
- Используют свои знания для создания лучших решений
Для каждой ключевой компетенции в команде нужен 1-2 специалиста.
---
Мое личное мнение: статья топ. По моему личному опыту, люди, которые умеют быстро погружаться в любые домены и находят общие паттерны - одни из самых драйвящих и ценных кадров. По крайней мере в моем опыте продуктовой разработки.
https://martinfowler.com/articles/expert-generalist.html
#managment #tshape #martinFowler
Статья в блоге Мартина Фаулера про T-shaped специалистов. Точнее, все текущие термины (T-shape, П-shape, и другие) плохо подходят, поэтому в статье вводится термин Expert-Generalist, который означает, что человек одновременно является и экспертом (в противовес generalist) и использует свою экспертизу во многих областях (в противовес эксперту в одной области).
В данном случае имеется в виду, что человек является экспертом в фундаментальных понятиях, которые позволяют ему быть успешным в областях, которые построены на этих понятиях. Классический пример из IT, это когда человек имеет опыт написания ПО на 3-4 языка программирования и ему после этого уже не так важно, на каком именно другом языке писать код, пока этот язык следует общим парадигмам (основан на том же фундаменте). Условно, человек, который писал на JS, PHP, JAVA, C++ с легкостью может войти в Go, Rust, Kotlin. Но, вероятно, столкнется с некоторыми проблемами при входе в Haskell. Но, скорее всего, сможет это сделать в короткие сроки.
В профессиональных кругах не любят генералистов, т.к. у них нет глубоких знаний ни в одной из зон.
В этом кроется ключевая разница между генералистами и экспертами-генералистами. Чистые генералисты знают все поверхностно. Эксперты-генералисты - знают фундаментальные принципы, знание которых позволяет им погружаться в смежные области
В чем сила таких специалистов:
Как правило, такие люди быстро обучаются - они изучат новый инструментарий, если он решает текущую задачу. Как следствие, они создадут более лучшее решение за счет подходящих инструментариев.
Эксперты-генералисты должны иметь хорошие навыки коммуникации и совместной работы. Т.к. они не являются экспертами в областях, они должны уметь запрашивать помощь у коллег. Понимание основных принципов помогает им быстро погружаться в контексты специалистов
Эксперты-генералисты игнорируют барьеру между отделами, командами, функциями. Это те люди, которые могут ускорить выполнение проекта т.к. для них не существует барьеров и, как следствие, они ускоряют коммуникацию, которая необходима для решения задачи
Ключевые качества экспертов-генералистов:
- Любознательность
- Умение сотрудничать
- Фокус на клиенте (бизнесовая направленность)
- Ставка на фундаментальные знания
- Широта знаний
- Способность понимать позицию смежных доменов (например, понимать проблемы SRE или DevOps)
Многие эксперты-генералисты вырастают в технических лидеров
Встает закономерны вопрос: "где брать таких специалистов?". Текущий найм устроен так, что мы скорее наймем ультра-эксперта в технологии, чем наймем человека, который любознателен и умеет погружаться в новые домены. В статье предлагается подход из двух решений:
- Перестать смотреть только на узкие хард-скилы. Вместо этого следует проверять человека на обучаемость, любознательность, создание условий для совместной работы
- Проводить внутренние тренинги и воркшопы, цель которых - погрузить специалистов в смежные области. В Thoughtworks есть 3 воркшопа, в которых специалисты делают решения из смежных областей. В рамках воркшопа они реализуют простые прототипы kafka, kubernetes, delta lake (штука для работы с данными). Создав прототип, люди начинают понимать базовые принципы, на которых основаны эти системы и начинают видеть рабочие ситуации с другой стороны
Это не означает, что больше не нужны специалисты, которые глубоко погружены в какую-то область знаний. Они, конечно же, нужны. В идеале в команде нужны и генералисты и специалисты. Специалисты в этом сетапе:
- Обучают генералистов, подсказывают им какие-то неочевидные нюансы, потеря которых сильно ухудшит решение
- Используют свои знания для создания лучших решений
Для каждой ключевой компетенции в команде нужен 1-2 специалиста.
---
Мое личное мнение: статья топ. По моему личному опыту, люди, которые умеют быстро погружаться в любые домены и находят общие паттерны - одни из самых драйвящих и ценных кадров. По крайней мере в моем опыте продуктовой разработки.
https://martinfowler.com/articles/expert-generalist.html
#managment #tshape #martinFowler
martinfowler.com
Expert Generalists
Being an Expert Generalist should be treated as a first-class skill, one that can be assessed and taught.
👍6❤3👎1🤔1 1
Forwarded from Effector news (Yan👀 Lobaty)
Всем привет!
@movpushmov осенью выступает на HolyJS с докладом «Почему вам (скорее всего) нужен эффектор». Поговорим о том, почему во фронтенде всё сложнее управлять состоянием и какие трудности это создаёт.
Покажет, чем Effector отличается от других инструментов и как он помогает проще решать даже запутанные задачи. Будем рады видеть вас на докладе!
@movpushmov осенью выступает на HolyJS с докладом «Почему вам (скорее всего) нужен эффектор». Поговорим о том, почему во фронтенде всё сложнее управлять состоянием и какие трудности это создаёт.
Покажет, чем Effector отличается от других инструментов и как он помогает проще решать даже запутанные задачи. Будем рады видеть вас на докладе!
HolyJS 2025 Autumn. JavaScript-конференция: от фронтенда до бэкенда
Почему вам (скорее всего) нужен Effector | Доклад на HolyJS 2025 Autumn
В докладе разберу, чем Effector отличается от других решений, и наглядно покажу, как легко с ним реализовать как простые, так и сложные кейсы.
🔥23😁17 9👎6❤3