Веб-серверы представлены в различных формах, каждая из которых имеет свои уникальные особенности, достоинства и недостатки. От мощного Apache с открытым исходным кодом до высокопроизводительного и эффективного Nginx, от удобного интерфейса IIS от Microsoft до лёгкого и быстрого LiteSpeed — выбор разнообразен и зачастую просто ошеломляет.
Независимо от того, ведёте ли вы небольшой блог или являетесь транснациональной платформой электронной коммерции, выбор правильного программного обеспечения для веб-сервера — это критически важное решение, которое может существенно повлиять на производительность, безопасность и масштабируемость вашего сайта.
В этом руководстве мы приводим подробное сравнение лучших вариантов, доступных в 2023 году. Наша цель — помочь понять нюансы каждого сервера, их пригодность для различных типов веб-сайтов и, в конечном счёте, помочь принять взвешенное решение, максимально соответствующее конкретным потребностям.
https://www.dev-notes.ru/articles/devops/best-web-server-2023/
Независимо от того, ведёте ли вы небольшой блог или являетесь транснациональной платформой электронной коммерции, выбор правильного программного обеспечения для веб-сервера — это критически важное решение, которое может существенно повлиять на производительность, безопасность и масштабируемость вашего сайта.
В этом руководстве мы приводим подробное сравнение лучших вариантов, доступных в 2023 году. Наша цель — помочь понять нюансы каждого сервера, их пригодность для различных типов веб-сайтов и, в конечном счёте, помочь принять взвешенное решение, максимально соответствующее конкретным потребностям.
https://www.dev-notes.ru/articles/devops/best-web-server-2023/
Заметки разработчика
Лучшие веб-сервера в 2023 году
Всесторонний анализ и сравнение программного обеспечения для веб-серверов. Найдите оптимальное серверное решение, соответствующее вашим потребностям в хостинге.
Миксины SCSS обеспечивают эффективный способ повторного использования CSS-кода. Миксины уменьшают дублирование и улучшают структуру кода за счёт инкапсуляции стилей в блоки многократного использования. Благодаря возможности принимать аргументы, миксины становятся невероятно адаптивными и универсальными. В этой статье мы расскажем о том, как SCSS-миксины улучшают разработку фронтенда, способствуя модульности и согласованности кода, и упрощая написание CSS.
Миксины SCSS очень важны для более эффективной разработки CSS. Они позволяют повторно использовать код, что уменьшает дублирование и улучшает организацию. Миксины превращают стили в многократно используемые блоки, что способствует модульности. Они принимают аргументы и в то же время повышают гибкость и расширяют возможности настройки. Многократно используемые стили упрощают разработку CSS, облегчая управление и обновление таблиц стилей. Они помогают в создании согласованного дизайна и улучшении структуры кода, и в итоге вы получаете более качественную таблицу стилей.
https://www.dev-notes.ru/articles/css/reuse-code-master-scss-mixins/
Миксины SCSS очень важны для более эффективной разработки CSS. Они позволяют повторно использовать код, что уменьшает дублирование и улучшает организацию. Миксины превращают стили в многократно используемые блоки, что способствует модульности. Они принимают аргументы и в то же время повышают гибкость и расширяют возможности настройки. Многократно используемые стили упрощают разработку CSS, облегчая управление и обновление таблиц стилей. Они помогают в создании согласованного дизайна и улучшении структуры кода, и в итоге вы получаете более качественную таблицу стилей.
https://www.dev-notes.ru/articles/css/reuse-code-master-scss-mixins/
Заметки разработчика
Повторное использование кода: Освоение SCSS-миксинов
В этой статье мы расскажем о том, как SCSS-миксины улучшают разработку фронтенда, обеспечивая модульность и согласованность кода и упрощая написание CSS.
Сравнение объектов в JavaScript не так просто, как сравнение примитивных типов данных. В статье рассматриваются пять способов глубокого сравнения объектов в JS.
В JavaScript существует 7 примитивных типов данных. Мы можем сравнивать значения любого из этих типов с помощью оператора равенства. Однако сравнение не примитивных типов, таких как объекты, сопряжено с определёнными трудностями, поскольку обычные операторы равенства не сравнивают значения объектов, как можно было бы ожидать.
https://www.dev-notes.ru/articles/javascript/five-different-ways-to-deep-compare-objects/
В JavaScript существует 7 примитивных типов данных. Мы можем сравнивать значения любого из этих типов с помощью оператора равенства. Однако сравнение не примитивных типов, таких как объекты, сопряжено с определёнными трудностями, поскольку обычные операторы равенства не сравнивают значения объектов, как можно было бы ожидать.
https://www.dev-notes.ru/articles/javascript/five-different-ways-to-deep-compare-objects/
Заметки разработчика
Пять различных способов глубокого сравнения JavaScript объектов
Сравнение объектов в JavaScript не так просто, как сравнение примитивных типов данных. В статье рассматриваются пять способов глубокого сравнения объектов в JS.
#Laravel Совет: после изменения записи Eloquent вы можете получить исходные атрибуты, вызвав
getOriginal()Следование стандартным соглашениям об именовании повышает читабельность и облегчает понимание кода. Однако многие разработчики не знают, как правильно использовать соглашения об именовании, и иногда усложняют ситуацию.
В этой статье я расскажу о 10 лучших практиках использования соглашений об именовании JavaScript, которых следует придерживаться.
https://www.dev-notes.ru/articles/javascript/ten-js-naming-conventions-every-developer-should-know/
В этой статье я расскажу о 10 лучших практиках использования соглашений об именовании JavaScript, которых следует придерживаться.
https://www.dev-notes.ru/articles/javascript/ten-js-naming-conventions-every-developer-should-know/
Заметки разработчика
Десять основных соглашений об именовании JavaScript
В этой статье перечислены 10 соглашений об именовании JavaScript, которые должен знать каждый разработчик JavaScript, чтобы писать понятный код.
Ещё в 2015 году была представлена революционная версия ES6 с множеством функций, широко используемых в современной веб-разработке.
С тех пор ECMAScript претерпел значительные изменения вплоть до версии ES12, официально известной как ECMAScript 2021. ES12 появился в июне 2021 года с новыми возможностями, улучшениями и некоторыми изменениями синтаксиса.
Каждый разработчик JavaScript, желающий добиться максимального результата, должен изучить последние возможности ES12. В этой статье мы рассмотрим шесть основных возможностей с примерами.
https://www.dev-notes.ru/articles/javascript/top-6-javascript-es12-features-you-should-use/
С тех пор ECMAScript претерпел значительные изменения вплоть до версии ES12, официально известной как ECMAScript 2021. ES12 появился в июне 2021 года с новыми возможностями, улучшениями и некоторыми изменениями синтаксиса.
Каждый разработчик JavaScript, желающий добиться максимального результата, должен изучить последние возможности ES12. В этой статье мы рассмотрим шесть основных возможностей с примерами.
https://www.dev-notes.ru/articles/javascript/top-6-javascript-es12-features-you-should-use/
Заметки разработчика
Шесть лучших возможностей ES12 JavaScript, которые следует использовать
В JavaScript ES12 реализовано множество функций, повышающих производительность труда разработчиков. Вот шесть основных возможностей с примерами кода.
Рефакторинг CSS — задача не из лёгких: его нужно провести так, чтобы не создать проблем. Сначала необходимо проанализировать существующую кодовую базу, провести аудит состояния CSS-кодовой базы, выявить слабые места, согласовать подход и убедить руководство в необходимости вложения времени и ресурсов в этот процесс.
CSS — это простой язык таблиц стилей для определения представления сайта или документа. Однако эта простота оставляет дверь открытой для многих потенциальных проблем и технических долгов — раздутый код, адская специфичность, дублирование блоков кода, не имеющих практически никаких различий, остатки неиспользуемых селекторов, ненужные хаки и обходные пути, и это лишь некоторые из них.
Такой технический долг, если он не выплачивается вовремя, может накапливаться и приводить к серьёзным проблемам в дальнейшем. Чаще всего это приводит к неожиданным побочным эффектам при добавлении новых компонентов пользовательского интерфейса и затрудняет сопровождение кодовой базы. Наверняка вам уже приходилось работать над проектом с плохой кодовой базой CSS и думать, как бы вы написали код по-другому, если бы была возможность провести рефакторинг или переписать все с нуля.
Рефакторинг больших частей CSS-кода — задача не из лёгких. Иногда может показаться, что это просто "удаление некачественного кода, написание более качественного CSS и развёртывание блестящего улучшенного кода". Однако необходимо учитывать множество других факторов, таких как сложность рефакторинга живой кодовой базы, ожидаемая продолжительность и загруженность команды, постановка целей рефакторинга, отслеживание эффективности и прогресса рефакторинга и т.д. Кроме того, необходимо убедить руководство или заинтересованные стороны проекта в необходимости инвестировать время и ресурсы в процесс рефакторинга.
В этом цикле из трёх статей мы рассмотрим процесс рефакторинга CSS от начала и до конца: начнём со знаний о том, как к нему подходить, общих плюсов и минусов рефакторинга, затем перейдём к самим стратегиям рефакторинга и закончим общими рекомендациями по размеру CSS-файлов и производительности.
https://www.dev-notes.ru/articles/css/refactoring-css-introduction/
CSS — это простой язык таблиц стилей для определения представления сайта или документа. Однако эта простота оставляет дверь открытой для многих потенциальных проблем и технических долгов — раздутый код, адская специфичность, дублирование блоков кода, не имеющих практически никаких различий, остатки неиспользуемых селекторов, ненужные хаки и обходные пути, и это лишь некоторые из них.
Такой технический долг, если он не выплачивается вовремя, может накапливаться и приводить к серьёзным проблемам в дальнейшем. Чаще всего это приводит к неожиданным побочным эффектам при добавлении новых компонентов пользовательского интерфейса и затрудняет сопровождение кодовой базы. Наверняка вам уже приходилось работать над проектом с плохой кодовой базой CSS и думать, как бы вы написали код по-другому, если бы была возможность провести рефакторинг или переписать все с нуля.
Рефакторинг больших частей CSS-кода — задача не из лёгких. Иногда может показаться, что это просто "удаление некачественного кода, написание более качественного CSS и развёртывание блестящего улучшенного кода". Однако необходимо учитывать множество других факторов, таких как сложность рефакторинга живой кодовой базы, ожидаемая продолжительность и загруженность команды, постановка целей рефакторинга, отслеживание эффективности и прогресса рефакторинга и т.д. Кроме того, необходимо убедить руководство или заинтересованные стороны проекта в необходимости инвестировать время и ресурсы в процесс рефакторинга.
В этом цикле из трёх статей мы рассмотрим процесс рефакторинга CSS от начала и до конца: начнём со знаний о том, как к нему подходить, общих плюсов и минусов рефакторинга, затем перейдём к самим стратегиям рефакторинга и закончим общими рекомендациями по размеру CSS-файлов и производительности.
https://www.dev-notes.ru/articles/css/refactoring-css-introduction/
Заметки разработчика
Рефакторинг CSS: Введение
Рефакторинг CSS — задача не из лёгких: проанализировать существующую кодовую базу, провести аудит состояния CSS, выявить слабые места и согласовать подход.
Иногда требуется добавить данные в Request или изменить их перед валидацией. В Laravel для этого есть несколько трюков — метод merge().
https://www.dev-notes.ru/articles/laravel/add-modify-request-data-before-validation/
https://www.dev-notes.ru/articles/laravel/add-modify-request-data-before-validation/
Заметки разработчика
Laravel: Добавление или изменение данных Request перед валидацией
Иногда требуется добавить данные в Request или изменить их перед валидацией. В Laravel для этого есть несколько трюков — метод merge().
В этой статье мы подробно рассмотрим сам процесс рефакторинга, стратегию инкрементного рефакторинга, визуальное регрессионное тестирование и сопровождение отрефакторенной кодовой базы.
После анализа CSS и его слабых мест, а также после того, как руководство дало "зелёный свет" рефакторингу проекта, пора приступать к работе. Команде необходимо согласовать внутренние стандарты кода и лучшие практики, спланировать стратегию рефакторинга и наметить индивидуальные задачи. Необходимо создать набор визуальных регрессионных тестов и план сопровождения для внедрения новых стандартов и лучших практик в будущем.
В первой части мы рассмотрели побочные эффекты некачественной кодовой базы CSS для конечных пользователей, команд разработчиков и руководства. Сопровождение, расширение и работа с некачественной кодовой базой затруднены и часто требуют дополнительных затрат времени и ресурсов. Прежде чем выносить предложение о рефакторинге на рассмотрение руководства и заинтересованных сторон, полезно подкрепить это предложение какими-либо достоверными данными о состоянии кодовой базы — не только для того, чтобы убедить руководство, но и для того, чтобы иметь измеримую цель процесса рефакторинга.
Предположим, что руководство одобрило рефакторинг проекта CSS. Команда разработчиков проанализировала и выявила слабые места в кодовой базе CSS и определила целевые задачи рефакторинга (размер файла, специфика, определения цветов и т.д.). В этой статье мы подробно рассмотрим сам процесс рефакторинга, стратегию инкрементного рефакторинга, визуальное регрессионное тестирование и сопровождение отрефакторенной кодовой базы.
https://www.dev-notes.ru/articles/css/refactoring-css-strategy-regression-testing-maintenance/
После анализа CSS и его слабых мест, а также после того, как руководство дало "зелёный свет" рефакторингу проекта, пора приступать к работе. Команде необходимо согласовать внутренние стандарты кода и лучшие практики, спланировать стратегию рефакторинга и наметить индивидуальные задачи. Необходимо создать набор визуальных регрессионных тестов и план сопровождения для внедрения новых стандартов и лучших практик в будущем.
В первой части мы рассмотрели побочные эффекты некачественной кодовой базы CSS для конечных пользователей, команд разработчиков и руководства. Сопровождение, расширение и работа с некачественной кодовой базой затруднены и часто требуют дополнительных затрат времени и ресурсов. Прежде чем выносить предложение о рефакторинге на рассмотрение руководства и заинтересованных сторон, полезно подкрепить это предложение какими-либо достоверными данными о состоянии кодовой базы — не только для того, чтобы убедить руководство, но и для того, чтобы иметь измеримую цель процесса рефакторинга.
Предположим, что руководство одобрило рефакторинг проекта CSS. Команда разработчиков проанализировала и выявила слабые места в кодовой базе CSS и определила целевые задачи рефакторинга (размер файла, специфика, определения цветов и т.д.). В этой статье мы подробно рассмотрим сам процесс рефакторинга, стратегию инкрементного рефакторинга, визуальное регрессионное тестирование и сопровождение отрефакторенной кодовой базы.
https://www.dev-notes.ru/articles/css/refactoring-css-strategy-regression-testing-maintenance/
Заметки разработчика
Рефакторинг CSS: Стратегия, регрессионное тестирование и сопровождение (часть 2)
В статье мы рассмотрим сам процесс рефакторинга, стратегию инкрементного рефакторинга, визуальное регрессионное тестирование и сопровождение кодовой базы.
z-index — свойство, используемое для управления порядком расположения слоёв в документе. Элементы с большим значением z-index располагаются над элементами с меньшим значением. Подобно тому, как оси x и y на странице определяют расположение элементов по горизонтали и вертикали, z-index определяет, как они располагаются друг над другом по оси z.https://www.dev-notes.ru/articles/css/mastering-z-index/
Заметки разработчика
Освоение z-index в CSS
Узнайте, как использовать z-index в CSS и лучшие стратегии для расположения элементов в стопку
SameSite — это механизм защиты браузера, определяющий, когда файлы cookie сайта включаются в запросы, поступающие с других сайтов. Ограничения на использование файлов cookie SameSite обеспечивают частичную защиту от различных межсайтовых атак, включая CSRF, межсайтовые утечки и некоторые CORS-эксплойты.
Начиная с 2021 года Chrome по умолчанию применяет ограничения
В этой статье мы рассмотрим принцип работы механизма SameSite и поясним некоторые термины, связанные с ним. Затем мы рассмотрим наиболее распространённые способы обхода этих ограничений, позволяющие осуществлять CSRF и другие межсайтовые атаки на сайты, которые на первый взгляд кажутся безопасными.
https://www.dev-notes.ru/articles/security/csrf-bypassing-samesite-restrictions/
Начиная с 2021 года Chrome по умолчанию применяет ограничения
Lax SameSite, если сайт, на котором размещён файл cookie, не задал явно свой собственный уровень ограничений. Это предложенный стандарт, и мы ожидаем, что в будущем такое поведение будет реализовано и в других основных браузерах. Таким образом, для тщательного тестирования на наличие векторов межсайтовых атак необходимо иметь чёткое представление о том, как работают эти ограничения и как их можно обойти.В этой статье мы рассмотрим принцип работы механизма SameSite и поясним некоторые термины, связанные с ним. Затем мы рассмотрим наиболее распространённые способы обхода этих ограничений, позволяющие осуществлять CSRF и другие межсайтовые атаки на сайты, которые на первый взгляд кажутся безопасными.
https://www.dev-notes.ru/articles/security/csrf-bypassing-samesite-restrictions/
Заметки разработчика
CSRF: Обход ограничений SameSite cookie-файлов
Ограничения SameSite cookie-файлы обеспечивают частичную защиту от различных межсайтовых атак, включая CSRF, межсайтовые утечки и некоторые CORS-эксплойты.
Логические свойства CSS — эффективный способ управления макетом веб-страниц. С течением времени CSS развивался в соответствии с требованиями современного веб-дизайна, и одним из значительных достижений последних лет стало появление логических свойств CSS. В этой статье мы познакомимся с логическими свойствами CSS, покажем, что они собой представляют, чем отличаются от традиционных (физических) свойств и почему они важны для создания гибких и отзывчивых макетов.
https://www.dev-notes.ru/articles/css/understanding-css-logical-properties/
https://www.dev-notes.ru/articles/css/understanding-css-logical-properties/
Заметки разработчика
Понимание логических свойств CSS
В этой статье мы познакомимся с логическими свойствами CSS, покажем, что они собой представляют, чем отличаются от традиционных (физических) свойств.
Каждый веб-разработчик должен знать о хешировании и шифровании, поскольку они являются важнейшими концепциями безопасности. При правильном использовании они позволяют повысить безопасность веб-приложений и обеспечить конфиденциальность персональной информации пользователей (Personally Identifiable Information — PII).
В этой статье мы рассмотрим хеширование и шифрование, а также их различия. Кроме того, мы узнаем, как использовать их в проектах Laravel для повышения безопасности приложений. Рассмотрим, как хэшировать данные и сравнивать их с обычным текстом. Расскажем о различных способах шифрования и дешифрования данных в Laravel.
https://www.dev-notes.ru/articles/laravel/a-guide-to-encryption-and-hashing-in-laravel/
В этой статье мы рассмотрим хеширование и шифрование, а также их различия. Кроме того, мы узнаем, как использовать их в проектах Laravel для повышения безопасности приложений. Рассмотрим, как хэшировать данные и сравнивать их с обычным текстом. Расскажем о различных способах шифрования и дешифрования данных в Laravel.
https://www.dev-notes.ru/articles/laravel/a-guide-to-encryption-and-hashing-in-laravel/
Заметки разработчика
Руководство по шифрованию и хэшированию в Laravel
В этой статье мы рассмотрим, что такое хеширование и шифрование, в чем разница между ними и как их использовать в своих приложениях Laravel.
Безопасность — обширная тема, и данная статья не охватывает её полностью. Да и возможно ли это вообще?
Тем не менее я хочу дать как можно больше полезных практик, советов и рекомендаций, которые помогут консолидировать ваши веб-приложения Laravel.
https://www.dev-notes.ru/articles/laravel/security-best-practices-2023/
Тем не менее я хочу дать как можно больше полезных практик, советов и рекомендаций, которые помогут консолидировать ваши веб-приложения Laravel.
https://www.dev-notes.ru/articles/laravel/security-best-practices-2023/
Заметки разработчика
12 лучших практик безопасности Laravel на 2023 год
Обеспечение безопасности приложения Laravel: защита конфиденциальных файлов, обновление пакетов и Laravel, использование политик и многое другое.
Laravel — мощный и гибкий PHP-фреймворк, завоевавший огромную популярность в мире веб-разработки.
Он предоставляет разработчикам богатый набор инструментов и функций, облегчающих создание надёжных и масштабируемых веб-приложений.
11-я версия Laravel выйдет в следующем году, и уже сейчас о ней кое-что известно.
https://www.dev-notes.ru/articles/laravel/laravel-11-release-date-and-new-features/
Он предоставляет разработчикам богатый набор инструментов и функций, облегчающих создание надёжных и масштабируемых веб-приложений.
11-я версия Laravel выйдет в следующем году, и уже сейчас о ней кое-что известно.
https://www.dev-notes.ru/articles/laravel/laravel-11-release-date-and-new-features/
Заметки разработчика
Laravel 11: грядущие изменения и дата выхода
Laravel 11 выйдет 12 марта 2024 года. Его разработка продолжается до сих пор. Давайте рассмотрим все значимые новые возможности, о которых мы уже знаем.
Погрузитесь в этот увлекательный учебник по рефакторингу фрагмента кода с использованием функции
https://www.dev-notes.ru/articles/php/max-function/
max в PHP.https://www.dev-notes.ru/articles/php/max-function/
Заметки разработчика
PHP функция max()
Погрузитесь в это увлекательное руководство по рефакторингу фрагмента кода с использованием функции max в PHP.
Иногда встречаются ошибки шлюзов, обычно "502 Bad Gateway" или "504 Gateway Timeout".
Это ошибки, которые возвращает Nginx, когда он посылает запрос к PHP, но PHP возвращает какую-то ошибку, говорящую, что он не может обработать запрос. Как правило, это НЕ ошибки, возникающие в вашем приложении, а (обычно) ошибки, возникающие ещё до того, как приложение обработает запрос.
https://www.dev-notes.ru/articles/devops/debugging-gateway-errors/
Это ошибки, которые возвращает Nginx, когда он посылает запрос к PHP, но PHP возвращает какую-то ошибку, говорящую, что он не может обработать запрос. Как правило, это НЕ ошибки, возникающие в вашем приложении, а (обычно) ошибки, возникающие ещё до того, как приложение обработает запрос.
https://www.dev-notes.ru/articles/devops/debugging-gateway-errors/
Заметки разработчика
Отладка ошибок шлюза/Gateway Errors 502 и 504
Иногда возникают ошибки шлюзов, обычно 502 Bad Gateway или 504 Gateway Timeout. Nginx возвращает эти ошибки, когда посылает запрос PHP, а PHP возвращает ошибку
Последняя версия стандарта языка JavaScript — ECMAScript 2023, являющаяся 14-й редакцией. В этом обновлении появились новые методы прототипа Array.
В этой статье я расскажу вам о четырёх новых методах, включая их работу с разреженными массивами и массивоподобными объектами. Если вы являетесь поклонником декларативного, функционального стиля написания программ на JavaScript, то вас ожидает приятная новость.
https://www.dev-notes.ru/articles/javascript/guide-four-new-array-prototype-methods/
В этой статье я расскажу вам о четырёх новых методах, включая их работу с разреженными массивами и массивоподобными объектами. Если вы являетесь поклонником декларативного, функционального стиля написания программ на JavaScript, то вас ожидает приятная новость.
https://www.dev-notes.ru/articles/javascript/guide-four-new-array-prototype-methods/
Заметки разработчика
Руководство по четырём новым методам Array.prototype в JavaScript
Четыре новых метода Array.prototype были недавно утверждены в рамках ECMAScript 2023. О том, как их использовать, читайте в этом подробном руководстве.
Sushi — это недостающий драйвер "массивов" Eloquent, поскольку иногда хочется использовать Eloquent без работы с базой данных.
Недавно я опубликовал статью о создании примера приложения с использованием Volt и Folio. В этой статье я использовал пакет Sushi Caleb Porzio для создания примера данных. Мне стало интересно, для чего ещё люди используют Sushi. И я написал в Твиттере, спросив, для чего они его используют. В этой статье мы рассмотрим основные концепции Sushi и несколько примеров его использования.
https://www.dev-notes.ru/articles/eloquent/laravel-sushi/
Недавно я опубликовал статью о создании примера приложения с использованием Volt и Folio. В этой статье я использовал пакет Sushi Caleb Porzio для создания примера данных. Мне стало интересно, для чего ещё люди используют Sushi. И я написал в Твиттере, спросив, для чего они его используют. В этой статье мы рассмотрим основные концепции Sushi и несколько примеров его использования.
https://www.dev-notes.ru/articles/eloquent/laravel-sushi/
Рефакторинг кодовой базы должен привести к аналогичной или повышенной производительности и улучшению состояния кодовой базы. В конце концов, если развёртывание обновлённой базы вызовет проблемы с загрузкой или производительностью, это приведёт к снижению трафика и доходов. К счастью, существует множество методов оптимизации, которые можно применить для решения потенциальных проблем с размером файлов и производительностью.
В предыдущих статьях этого цикла мы рассмотрели аудит состояния кодовой базы CSS, стратегию инкрементного рефакторинга CSS, тестирование и сопровождение. Независимо от того, насколько улучшилась кодовая база CSS в процессе рефакторинга и насколько она стала более удобной для обслуживания и расширения, конечная таблица стилей должна быть оптимизирована для достижения наилучшей производительности и минимального размера файла.
Развёртывание переработанной кодовой базы не должно привести к снижению производительности сайта и ухудшению пользовательского опыта. В конце концов, пользователи не будут вечно ждать загрузки сайта. Кроме того, руководство компании будет недовольно снижением трафика и доходов, вызванным неоптимизированной кодовой базой, несмотря на улучшение качества кода.
В этой статье мы рассмотрим стратегии оптимизации CSS, которые позволяют оптимизировать размер CSS-файла, время загрузки и производительность рендеринга. Таким образом, обновлённая кодовая база CSS будет не только более удобной в обслуживании и расширяемой, но и производительной, а также будет отвечать всем требованиям, которые важны как для конечного пользователя, так и для руководства.
https://www.dev-notes.ru/articles/css/refactoring-css-optimizing-size-performance/
В предыдущих статьях этого цикла мы рассмотрели аудит состояния кодовой базы CSS, стратегию инкрементного рефакторинга CSS, тестирование и сопровождение. Независимо от того, насколько улучшилась кодовая база CSS в процессе рефакторинга и насколько она стала более удобной для обслуживания и расширения, конечная таблица стилей должна быть оптимизирована для достижения наилучшей производительности и минимального размера файла.
Развёртывание переработанной кодовой базы не должно привести к снижению производительности сайта и ухудшению пользовательского опыта. В конце концов, пользователи не будут вечно ждать загрузки сайта. Кроме того, руководство компании будет недовольно снижением трафика и доходов, вызванным неоптимизированной кодовой базой, несмотря на улучшение качества кода.
В этой статье мы рассмотрим стратегии оптимизации CSS, которые позволяют оптимизировать размер CSS-файла, время загрузки и производительность рендеринга. Таким образом, обновлённая кодовая база CSS будет не только более удобной в обслуживании и расширяемой, но и производительной, а также будет отвечать всем требованиям, которые важны как для конечного пользователя, так и для руководства.
https://www.dev-notes.ru/articles/css/refactoring-css-optimizing-size-performance/
Заметки разработчика
Рефакторинг CSS: Оптимизация размера и производительности
Существует множество приёмов оптимизации CSS для решения потенциальных проблем с размером файла и производительностью. Давайте рассмотрим некоторые из них.