Re: HTMX and Templating

AS PROMISED, my weird templating method. I'm putting this here to atleast archive it incase someone else sees a solution for the 'flicker' issue and wants it for their own blog.

    <div hidden> <!-- i have this hidden so you dont see it when loading in -->
        <article id="expanded-post">
            <h1> sample heading </h1>
            <p id="post-text"> 
            sample text
            </p>
        </article>
    </div>
    
    <main id="replace-me"></main>
    
    <script>
    function loadHome() {
        fetch('/index.html')
        .then(response => response.text())
        .then(data => {
            document.getElementById("replace-me").innerHTML = data;
    
            const expandedPost = document.getElementById("expanded-post");
            const middle = document.getElementById("middle");
    
            if (expandedPost && middle) {
                middle.innerHTML = expandedPost.outerHTML;
                expandedPost.remove();
                htmx.process(document.body);
            }
             
        })
        .catch(error => console.error('Error:', error));
    }
    
    loadHome();
    </script>