How to organize frontend development in the context of an existing Bitrix project?

Question

1C-Bitrix

Now I am constantly faced with the fact that I have to typeset inside an existing bitrix project.
The company I work for has projects that are not from scratch and often have to modify the existing interface, so there is no way to work in isolation from the backend.

My current workflow

Я выработал для себя схему, по которой могу использовать часть необходимых мне инструментов, и работать стало чуть легче, но это не решает всех проблем. Основные проблемы в том, что зачастую сайты имеют огромную иерархию с кучей компонентов и это сильно затрудняет поиск необходимых участков кода. Иногда своей версткой можно сломать участки кода с php. Так как есть условия на php, то не все области сайта отображаются на всех страницах и, как следствие, нужно знать определенные сценарии или постоянно бегать в поисках нужных блоков для стилизации и так далее.

I only see 2 options:

• Be patient, there is no way out
  
• Imagine that you are in a fairy tale and you have a lot of time. Transfer the frontend to a separate collector, and simulate the backend using fake data. Use pug, browser sync, etc. to the fullest in your work.
  

Share your experience, how does it work?

Answer 1

If the development after the refactoring is more efficient and the separation pays off, then the separation is worth it.
If the project is huge, low-quality and old, then refactoring will not be economically justified.