AI News HubLIVE
In-site rewrite2 min read

Show HN: IDE for code assembly of reusable code blocks

Tetrees is an AI IDE for assembling reusable code blocks. The team eliminated the white flash on cold load by inlining critical styles, optimizing favicon, and separating the stylesheet for caching and parallel fetch.

SourceHacker News AIAuthor: joseph3553

and elements (rather than an inline in ) because Vite 5's html-inline-proxy plugin still chokes on tags here — see the bootstrap.css public-folder migration for the same plugin's previous breakage. Inline style attributes are processed by the browser's HTML parser BEFORE any external stylesheet downloads, so the dark Tetrees background paints the moment the first 1 KB of HTML arrives — well before bootstrap.css, gtag, Clarity, or the main JS bundle land. This is the primary fix for the "white flash" Microsoft Clarity has been recording on cold POPs (Canada/NA mobile + Reddit in-app webview), and it costs zero extra bytes on the wire. -->

` entry because Chrome/Edge prefer SVG when both formats are listed and our SVG's thin bracket strokes collapse to "just a T" at 16×16 favicon sizes. PNGs downscale cleaner and match the provided square logo. ?v= query busts the browser's indefinite favicon cache (HTTP cache headers don't reset it on their own). -->

Tetrees — The AI IDE for ready-made code-block assembly

Seoul AWS) can be 2-5 seconds of pure white. The BE log analysis + Clarity recordings show this cohort consistently bouncing inside that window.

Branding intent: lock in the Tetrees emerald on the very first frame so a paid-ad click knows where they landed before the JS bundle finishes parsing. Spinner cadence (1.2s) matches the post-mount app loader so the handoff feels continuous when React commits.

Why a separate stylesheet vs inline : Vite 5's html-inline-proxy plugin has a long-standing issue with processing inline blocks in index.html (see vitejs issue #14108). Serving from /public bypasses processing entirely and gets a clean .css filename for CDN caching — browsers fetch this in parallel with the head HTML stream so it ends up on the wire before the main bundle anyway. Marked fetchpriority="high" to push it above other tag-manager assets on the critical path. -->

tag below uses, so the fetch kicked off here is the exact same resource the body's consumes — no double download. -->

rule above; redundant but cheap, and belt-and-braces against any UA that paints body differently (notably some older Android WebViews that ignore html bg). -->

Tetrees — loading the AI IDE…