Философия программирования

Что за звери такие cohesion и coupling Возможно, вы слышали, что при выборе архитектуры (или её проектировании) нужно стремиться к high cohesion (высокому сцеплению) и low coupling (низкой связанности). Так вот, cohesion и coupling — два базовых критерия оценки качества архитектуры. Cohesion — это то, насколько части одного модуля логически относятся к одной задаче. Чем выше cohesion, тем больше «про одно» этот модуль, тем проще его понять и менять. Можно даже сказать, что high cohesion это прин...

Vite vs Webpack: нюансы сборки В проекте на Vite обнаружил неожиданное (для меня) поведение: при загрузке чанка страницы, браузер также загружает чанки двух других, не связанных с ней, страниц: ./page-a.js ./page-b.js ./page-c.js Почему так? Vite (rollup) помещает общий компонент, который используется в нескольких асинхронных чанках, в один из них. Другими словами, при загрузке любого из этих чанков, браузер вынужден загрузить и тот чанк, в котором находятся общий компонент. Однако, это не являе...

Императив vs Декларатив. Точно понимаете разницу? Императивный стиль описывает КАК достичь результата (пошаговые инструкции), а декларативный — ЧТО нужно получить (описание желаемого исхода). Скорее всего, именно так вы ответите на вопрос, чем отличаются эти стили программирования, и по сути вы будете правы. Но давайте рассмотрим простой пример: const isEven = count % 2 === 0; Сможете чётко ответить, какой именно стиль программирования тут используется, ЧТО или КАК? Если вы засомневались или под...

Простой пример сокрытия императивного кода за декларативным интерфейсом Для начала вспомним, что декларативное программирование фокусируется на описании желаемого результата, вместо указания пошаговых действий. Основное преимущество этого стиля в том, что он делает код короче и выразительнее, скрывая детали реализации. Простой пример, где isLoading отвечает за блокировку кнопки Submit: function CreateOrder(props) { const [isLoading, setLoading] = createSignal(false); function onSubmit() { setLoa...

Раскладывание кода по папкам — архитектура? Если говорить максимально просто, то архитектура в программировании — это организация системы, которая определяет её основные части и правила, как они между собой взаимодействуют. Например, функциональное мышление — это тоже архитектура, потому что оно делит систему на компоненты (данные, вычисления, действия) и задаёт, как они должны работать вместе. А что насчёт раскладывания кода по папкам? Да, это тоже часть архитектуры. В FSD (Feature-Sliced Desig...

Проверяем импорты через ESLint В процессе улучшения структуры проекта, которую я описывал здесь, задумался над базовыми проверками корректности импортов. Эта структура строится на «функциональном мышлении» (далее ФМ), в котором код должен быть разделён на данные, вычисления и действия, поэтому необходимо проверять корректность импортов между определёнными сегментами. Например, чтобы сегмент ui (в контексте ФМ это вычисления) не мог импортировать сегмент $api (в контексте ФМ это действия). Н...

React: memo и useMemo Это инструменты, решающие конкретные задачи, или головная боль разработчиков? Прежде чем отвечать на этот вопрос, рассмотрим три примера: 1️⃣ Контекст function Page() { const { id } = useParams(); const { data } = useQueryData(); // ...fetching other data return ( <Context.Provider value={{ id, value: data.value }} > <Content /> </Context.Provider> ); } При каждом рендере провайдер получает новый объект. При этом, подписанные на этот контекст компоненты также будут выполнен...

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

Самые изменяемые файлы проекта, о чём говорят и как посмотреть Частота изменения файлов — интересная метрика, способная подсветить места повышенных рисков, архитектурных проблем и некоторых других моментов. Для более полной картины происходящего, рекомендуется рассматривать её в совокупности с такой информацией, как количество строк в файле, сложность кода, связи между файлами, количество задач и их связанность. Собрать список самых изменяемых файлов, можно, например, с помощью git log. Важная р...

Малоизвестные возможности Intl Intl часто ассоциируется с простым форматированием чисел, дат и валют. Однако это API содержит и другие полезные функции: Intl.ListFormat — форматирует перечисления, корректно вставляя запятые и союзы: // "яблоки, груши и бананы" (new Intl.ListFormat("RU")).format( ["яблоки", "груши", "бананы"] ); Intl.RelativeTimeFormat — форматирует относительное время: const rtf = new Intl.RelativeTimeFormat("RU"); rtf.format(3, "days"); // "через 3 дня" rtf.format(-2, "hours");...