В этой статье мы подробно рассмотрим сам процесс рефакторинга, стратегию инкрементного рефакторинга, визуальное регрессионное тестирование и сопровождение отрефакторенной кодовой базы.

После анализа CSS и его слабых мест, а также после того, как руководство дало "зелёный свет" рефакторингу проекта, пора приступать к работе. Команде необходимо согласовать внутренние стандарты кода и лучшие практики, спланировать стратегию рефакторинга и наметить индивидуальные задачи. Необходимо создать набор визуальных регрессионных тестов и план сопровождения для внедрения новых стандартов и лучших практик в будущем.

В первой части мы рассмотрели побочные эффекты некачественной кодовой базы CSS для конечных пользователей, команд разработчиков и руководства. Сопровождение, расширение и работа с некачественной кодовой базой затруднены и часто требуют дополнительных затрат времени и ресурсов. Прежде чем выносить предложение о рефакторинге на рассмотрение руководства и заинтересованных сторон, полезно подкрепить это предложение какими-либо достоверными данными о состоянии кодовой базы — не только для того, чтобы убедить руководство, но и для того, чтобы иметь измеримую цель процесса рефакторинга.

Предположим, что руководство одобрило рефакторинг проекта CSS. Команда разработчиков проанализировала и выявила слабые места в кодовой базе CSS и определила целевые задачи рефакторинга (размер файла, специфика, определения цветов и т.д.). В этой статье мы подробно рассмотрим сам процесс рефакторинга, стратегию инкрементного рефакторинга, визуальное регрессионное тестирование и сопровождение отрефакторенной кодовой базы.

https://www.dev-notes.ru/articles/css/refactoring-css-strategy-regression-testing-maintenance/