SPA на голом Javascript. Наполняемость страниц

Необходимо переделать многостраничный сайт на одностраничный (SPA) используя модель MVС. Так как я студент изучающий Javascript, то допустимо использовать HTML, CSS и Javascript и немного JQuery(слайды). В примерах которые я смотрел return возвращает кусок кода HTML. Обычно у всех в примерах 2-4 строчки HTML. Выглядит в целом неплохо.У меня вопрос, если кода много (допустим 150 и более строк кода HTML) он так же тупо огромным куском копируется из HTML, вставляется и через innerHTML потом выводится на экран? Или необходимо разбивать на более мелкие группы? И второй вопрос по скрипту. Вставленный таким образом скрипт через <script></script> не работает. Пришлось оставлять блок где был скрипт пустым, дописывать метод myScript и потом вручную добрасывать в блоки скрипты. Более детально о чем я в примере кода который я выложил. Допустимо ли так делать? Может есть стандартные простые адекватные решения?

    id: "secondmain",
    title: `OOО "БПИ" гидравлическое оборудование - поставки, cервис, ремонт в Беларуси`,
    render: (className = "container", ...rest) => {
        return `
        <section class="${className}">
        <div class="left_sidebar left_sidebar_v2">
        <div class="engineering">
            <h3>Инжиниринг</h3>
            <ul>
                <li><a href="#engineering_hydraulic_systems">Проектирование гидросистем</a></li>
                <li><a href="#engineering_power_pack">Проектирование гидростанций</a></li>
                <li><a href="#production_power_pack">Производство гидростанций</a></li>
            </ul>
        </div>
        <div class="hydraulics_service">
            <h3>Сервис гидравлики</h3>
            <ul>
                <li><a href="#hydraulics_diagnostics">Диагностика и ремонт</a></li>
                <li><a href="#service_center">Сервисный центр</a></li>
                <li><a href="#hydrofication">Гидрофикация</a></li>
            </ul>
        </div>
        <div class="sale">
            <h3>Продажа</h3>
            <ul>
                <li><a href="#pump_motor">Гидронасосы, гидромоторы</a></li>
                <li><a href="#valve">Гидроклапаны</a></li>
                <li><a href="#directional_valve">Гидрораспределители</a></li>
                <li><a href="#hydraulics_accessories">Аксессуары для гидравлики</a></li>
                <li><a href="#accumulator">Гидроаккумуляторы</a></li>
                <li><a href="#radiators">Теплообменники</a></li>
                <li><a href="#filters">Фильтры</a></li>
            </ul>
        </div>
    </div>
    <div class="content content_v2 main">
        <h2 style="text-align: left; margin-bottom: 20px;">Компания &laquo;БПИ&raquo;</h2>
        <p> Мы рады приветствовать Вас на сайте компании &laquo;БПИ&raquo;.
            Наша компания имеет большой опыт в направлении промышленная гидравлика, мы
            разбираемся в том, что продаем и надеемся быть Вам полезными. Мы предлагает широкую
            номенклатуру гидравлических компонентов различных мировых производителей. Большое количество
            комплектующих находится на складе. Наши специалисты грамотно и качественно осуществляют подбор
            необходимых гидравлических компонентов по характеристикам, необходимых заказчику. Подбор аналогов
            других производителей.</p>
        <h3>Основные направления деятельности нашей компании:</h3>
        <ul>
            <li>Выездная диагностика и ремонт гидроприводов любой сложности;</li>
            <li>Модернизация гидроприводов;</li>
            <li>Монтаж и демонтаж гидравлического оборудования;</li>
            <li>Изготовление и ремонт гидростанций по индивидуальным проектам;</li>
            <li>Изготовление и ремонт гидроцилиндров;</li>
            <li>Производство рукавов высокого давления;</li>
            <li>Ремонт, проверка и дозаправка гидропневмоаккумуляторов;</li>
            <li>Производство фильтровальных установок;</li>
            <li>Продажа воздушных, топливных и масляных фильтров;</li>
            <li>Продажа гидравлического оборудования и компонентов;</li>
        </ul>
        <h3>Наши преимущества:</h3>
        <ul>
            <li>Высококвалифицированный персонал;</li>
            <li>Профессиональный подход к каждому клиенту;</li>
            <li>Круглосуточная техническая помощь в Минске;</li>
            <li>Бесплатная консультация наших специалистов;</li>
            <li>Гарантия на все виды работ;</li>
        </ul>
        <p>Мы предлагаем решение проблем в области обслуживания и ремонта гидравлики. Стремимся к долгосрочным
            партнерским отношениям.</p>
        <p class="slogan">Гарантируем высокое качество в кратчайшие сроки!!!</p>
        <div class="slider_man_bottom">
            <img src="img/slider_man_bottom/1.JPG" alt="slide_1">
            <img src="img/slider_man_bottom/2.JPG" alt="slide_2">
            <img src="img/slider_man_bottom/3.jpg" alt="slide_3">
            <img src="img/slider_man_bottom/4.jpg" alt="slide_4">
            <img src="img/slider_man_bottom/5.jpg" alt="slide_5">
            <img src="img/slider_man_bottom/6.jpg" alt="slide_6">
            <img src="img/slider_man_bottom/7.jpg" alt="slide_7">
        </div>
    </div>
    <div class="clear">
    </div>
</div>
        </section>
      `;
    },
    myScript: () => {
        let divSliderMainBottom = document.querySelector(".content_v2");
        let scriptSliderMainBottom = document.createElement("script");
        scriptSliderMainBottom.setAttribute("src", "js/scriptSliderMainBottom.js");
        divSliderMainBottom.appendChild(scriptSliderMainBottom);
    }
};

Ответы (0 шт):