[{"data":1,"prerenderedAt":37},["ShallowReactive",2],{"$fCbOLNoOJ8rO28uRnGh1m8IMMnUO2rzGXk1f_f1MdX3k":3},{"article":4,"relatedArticles":16,"tagCounts":35},{"slug":5,"content":6,"headings":7,"notes":8,"groupedNotes":9,"title":10,"date":11,"description":12,"tags":13,"author":15},"stemmler-khalil-client-side-architecture-basics-ii","\u003Cp>Данная статья представляет собой вторую часть руководства по архитектуре клиентских приложений, в которой автор рассматривает ключевые принципы проектирования, применимые к фронтенд-разработке. Хотя принципы «чистой архитектуры» (Clean Architecture) эффективны, на стороне клиента не требуется их точная копия; вместо этого важно адаптировать фундаментальные идеи, которые лежат в их основе. Автор выделяет два наиболее значимых принципа: разделение команд и запросов (CQS) и разделение ответственности (SoC).\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Command-Query Separation (CQS)\u003C\u002Fstrong> — это принцип, согласно которому любая операция является либо командой, либо запросом. \u003Cstrong>Команды\u003C\u002Fstrong> изменяют состояние системы, но не возвращают данные, тогда как \u003Cstrong>запросы\u003C\u002Fstrong> возвращают данные, но не вызывают побочных эффектов и не меняют состояние. Основным преимуществом этого паттерна является упрощение рассуждений о коде за счет четкого разделения путей чтения и записи. Это облегчает тестирование, так как проверку запроса проще проводить, если он гарантированно не меняет систему, а также помогает в решении проблем с инвалидацией кэша: кэш остается актуальным до тех пор, пока не будет выполнена команда. Примерами использования CQS являются API хука \u003Ccode>useState\u003C\u002Fcode> в React и структура GraphQL с его запросами и мутациями.\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Separation of Concerns (SoC)\u003C\u002Fstrong> подразумевает осознанное соблюдение логических границ между различными архитектурными задачами приложения. Автор отмечает, что даже в простых приложениях одно действие пользователя (например, удаление элемента из списка) затрагивает множество аспектов: отображение, бизнес-логику, сетевые запросы и обновление состояния. Вместо хаотичного размещения разных видов логики (авторизации, валидации и т. д.), их следует классифицировать и делегировать соответствующим слоям.\u003C\u002Fp>\n\u003Cp>Взаимодействие этих принципов приводит к концепции \u003Cstrong>«вертикальных срезов» (vertical slices)\u003C\u002Fstrong>, где каждая функция приложения рассматривается как срез, проходящий через весь стек. Когда разработчик изменяет или добавляет функцию, он работает с конкретным вертикальным срезом, затрагивая только нужные слои (презентационный, слой логики взаимодействия и т. д.). Такой подход минимизирует зависимости между срезами и максимизирует связность внутри них, что позволяет быстрее находить места в коде для внесения изменений. Понимание ответственности каждого слоя помогает разработчикам осознанно выбирать инструменты (например, Apollo Client для данных или Redux для состояния) и решать, стоит ли использовать готовую библиотеку или создавать собственное решение для конкретного слоя.\u003C\u002Fp>",[],[],{},"Client-Side Architecture Basics: II. Principles (2020)","2026-07-22","Принципы CQS и разделения ответственности для фронтенда — чтение и запись, вертикальные срезы и выбор инструментов.",[14],"Программирование","Stemmler, Khalil",[17,23,29],{"slug":18,"title":19,"description":20,"date":11,"author":21,"tags":22},"brooks-frederick-p-jr-the-mythical-man-month-essays-on","The Mythical Man-Month: Essays on Software Engineering (1995)","Классика управления разработкой — мифический человеко-месяц, хирургические бригады, концептуальная целостность и отсутствие серебряной пули.","Brooks, Frederick P., Jr.",[14],{"slug":24,"title":25,"description":26,"date":11,"author":27,"tags":28},"mdn-contributors-css-performance-optimization-2025","CSS performance optimization (2025)","Оптимизация CSS для быстрого рендера — блокировка отрисовки, reflow, анимации на GPU, шрифты и CSS Containment.","MDN Contributors",[14],{"slug":30,"title":31,"description":32,"date":11,"author":33,"tags":34},"simpson-kyle-you-don-t-know-js-async-performance-2015","You Don't Know JS: Async & Performance (2015)","Асинхронность и производительность в JavaScript — событийный цикл, промисы, генераторы, Web Workers и практики бенчмаркинга.","Simpson, Kyle",[14],{"Программирование":36},9,1785324880332]