Files
TrueGrowth/apps/web/public/en/home.html

1308 lines
38 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>TrueGrowth | AI Canvas and Image Workflow</title>
<meta
name="description"
content="TrueGrowth is an AI canvas workspace for image generation, prompt reasoning, flowcharts, mind maps, asset libraries, and reusable creative workflows in one browser canvas."
/>
<meta
name="keywords"
content="TrueGrowth,AI canvas,AI image workflow,AI image generation workspace,AI whiteboard,GPT-Image-2,DeepSeek-v4,flowchart maker,mind map maker"
/>
<meta name="robots" content="index,follow,max-image-preview:large" />
<link rel="canonical" href="https://TrueGrowth.ai/en/home.html" />
<link
rel="alternate"
hreflang="zh-CN"
href="https://TrueGrowth.ai/home.html"
/>
<link
rel="alternate"
hreflang="en"
href="https://TrueGrowth.ai/en/home.html"
/>
<link
rel="alternate"
hreflang="x-default"
href="https://TrueGrowth.ai/home.html"
/>
<meta property="og:type" content="website" />
<meta
property="og:title"
content="TrueGrowth | AI Canvas and Image Workflow"
/>
<meta
property="og:description"
content="Create AI images, reason through prompts, organize assets, and turn ideas into flowcharts, mind maps, and reusable workspaces."
/>
<meta property="og:url" content="https://TrueGrowth.ai/en/home.html" />
<meta property="og:locale" content="en_US" />
<meta property="og:locale:alternate" content="zh_CN" />
<meta
property="og:image"
content="https://TrueGrowth.ai/product_showcase/九宫格拆图.gif"
/>
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="TrueGrowth | AI Canvas" />
<meta
name="twitter:description"
content="An AI canvas for image generation, prompt reasoning, flowcharts, mind maps, and reusable creative assets."
/>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@graph": [
{
"@type": "SoftwareApplication",
"@id": "https://TrueGrowth.ai/en/home.html#software",
"name": "TrueGrowth",
"alternateName": "TrueGrowth",
"url": "https://TrueGrowth.ai/en/home.html",
"applicationCategory": "DesignApplication",
"operatingSystem": "Any",
"inLanguage": "en",
"description": "TrueGrowth is an AI canvas workspace for image generation, prompt reasoning, flowcharts, mind maps, asset libraries, and reusable creative workflows in one browser canvas.",
"keywords": [
"TrueGrowth",
"AI canvas",
"AI image generation workspace",
"AI whiteboard",
"GPT-Image-2",
"DeepSeek-v4",
"flowchart maker",
"mind map maker"
],
"image": "https://TrueGrowth.ai/product_showcase/九宫格拆图.gif",
"offers": {
"@type": "Offer",
"price": "0",
"priceCurrency": "USD"
}
},
{
"@type": "FAQPage",
"@id": "https://TrueGrowth.ai/en/home.html#faq",
"inLanguage": "en",
"mainEntity": [
{
"@type": "Question",
"name": "How is TrueGrowth different from a regular AI chat tool?",
"acceptedAnswer": {
"@type": "Answer",
"text": "AI chat tools are great for conversations. TrueGrowth is built for execution: generated images, prompts, notes, diagrams, and assets stay together on a reusable canvas."
}
},
{
"@type": "Question",
"name": "What AI image tasks can TrueGrowth support?",
"acceptedAnswer": {
"@type": "Answer",
"text": "TrueGrowth is useful for covers, posters, character concepts, product visuals, social media images, inspiration boards, and multi-version visual exploration."
}
},
{
"@type": "Question",
"name": "How does DeepSeek-v4 fit into TrueGrowth?",
"acceptedAnswer": {
"@type": "Answer",
"text": "DeepSeek-v4 can help expand prompts, draft copy, break down requirements, plan storyboards, and structure ideas before the results are organized on the canvas."
}
}
]
}
]
}
</script>
<style>
:root {
--bg: #ffffff;
--ink: #0f172a;
--text: #334155;
--muted: #64748b;
--surface: #ffffff;
--surface-soft: #f8fafc;
--accent: #2563eb;
--accent-2: #0891b2;
--accent-3: #16a34a;
--border: rgba(15, 23, 42, 0.1);
--shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body {
margin: 0;
color: var(--ink);
background:
linear-gradient(180deg, rgba(248, 250, 252, 0.88), #fff 360px),
repeating-linear-gradient(
90deg,
rgba(15, 23, 42, 0.035) 0,
rgba(15, 23, 42, 0.035) 1px,
transparent 1px,
transparent 42px
);
font-family: Inter, ui-sans-serif, system-ui, -apple-system,
BlinkMacSystemFont, "Segoe UI", sans-serif;
line-height: 1.6;
}
a {
color: var(--accent);
transition: color 0.2s ease;
}
a:hover {
color: #1d4ed8;
}
img {
max-width: 100%;
height: auto;
}
main {
max-width: 1180px;
margin: 0 auto;
padding: 22px 22px 76px;
}
.nav {
display: flex;
align-items: center;
justify-content: space-between;
gap: 18px;
padding: 10px 0 18px;
}
.brand {
display: inline-flex;
align-items: center;
gap: 10px;
color: var(--ink);
font-size: 18px;
font-weight: 800;
text-decoration: none;
}
.brand-logo {
display: block;
width: 42px;
height: 42px;
object-fit: contain;
filter: drop-shadow(0 8px 18px rgba(37, 99, 235, 0.2));
}
.nav-links {
display: flex;
flex-wrap: wrap;
gap: 16px;
font-size: 14px;
}
.nav-links a {
color: var(--muted);
text-decoration: none;
}
.nav-links a:hover {
color: var(--ink);
}
.hero {
display: grid;
grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
gap: 52px;
align-items: center;
padding: 22px 0 18px;
}
.hero-copy {
max-width: 640px;
}
h1,
h2,
h3,
p {
margin-top: 0;
}
h1 {
margin-bottom: 22px;
color: var(--ink);
font-size: 54px;
font-weight: 800;
letter-spacing: 0;
line-height: 1.04;
}
h2 {
margin-bottom: 16px;
color: var(--ink);
font-size: 36px;
font-weight: 740;
letter-spacing: 0;
line-height: 1.16;
}
h3 {
margin-bottom: 10px;
color: var(--ink);
font-size: 18px;
font-weight: 700;
}
.lead,
.section-lead,
.card p,
.work-card p,
.faq p,
.model-note {
color: var(--muted);
line-height: 1.72;
}
.lead {
max-width: 560px;
margin-bottom: 26px;
font-size: 17px;
}
.proof {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 8px;
margin: 0;
padding: 0;
list-style: none;
}
.proof-item,
.model-panel,
.card,
.work-card,
.steps li,
.faq li,
.cta-band {
border: 1px solid var(--border);
border-radius: 8px;
background: rgba(255, 255, 255, 0.92);
box-shadow: var(--shadow);
}
.proof-item {
min-height: 78px;
padding: 14px;
}
.proof-value {
display: block;
margin-bottom: 6px;
color: var(--ink);
font-size: 17px;
font-weight: 800;
}
.proof-label {
display: block;
color: var(--muted);
font-size: 12px;
line-height: 1.45;
}
.cta-row,
.cta-actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.cta-row {
margin-top: 28px;
}
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 48px;
padding: 0 20px;
border-radius: 8px;
font-size: 15px;
font-weight: 700;
text-decoration: none;
transition:
transform 0.2s ease,
border-color 0.2s ease,
background 0.2s ease;
}
.btn-primary {
border: 1px solid transparent;
background: #0f172a;
color: #fff;
}
.btn-primary:hover {
transform: translateY(-2px);
color: #fff;
background: #1e293b;
}
.btn-secondary {
border: 1px solid var(--border);
background: #fff;
color: var(--ink);
}
.btn-secondary:hover {
transform: translateY(-2px);
border-color: rgba(37, 99, 235, 0.42);
color: var(--accent);
}
.hero-panel {
position: relative;
overflow: hidden;
padding: 12px;
border: 1px solid var(--border);
border-radius: 10px;
background: #fff;
box-shadow: var(--shadow);
}
.hero-panel img {
display: block;
width: 100%;
border: 1px solid var(--border);
border-radius: 8px;
}
.hero-panel-caption {
position: absolute;
top: 24px;
left: 24px;
display: grid;
gap: 4px;
max-width: 230px;
padding: 12px 14px;
border: 1px solid rgba(255, 255, 255, 0.72);
border-radius: 8px;
background: rgba(255, 255, 255, 0.88);
box-shadow: 0 14px 34px rgba(15, 23, 42, 0.1);
}
.hero-panel-caption strong {
color: var(--ink);
font-size: 13px;
}
.hero-panel-caption span {
color: var(--muted);
font-size: 12px;
line-height: 1.45;
}
.section {
margin-top: 80px;
color: var(--text);
}
.hero + .section {
margin-top: 52px;
}
.section-head {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 24px;
margin-bottom: 32px;
}
.section-lead {
max-width: 680px;
margin-bottom: 0;
font-size: 16px;
}
.model-grid,
.feature-grid,
.work-grid,
.faq {
display: grid;
gap: 24px;
}
.model-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.feature-grid,
.work-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.model-panel,
.card,
.faq li {
padding: 28px;
}
.model-panel strong {
display: block;
margin-bottom: 12px;
color: var(--ink);
font-size: 28px;
font-weight: 800;
}
.tag,
.icon {
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 999px;
font-weight: 700;
}
.tag {
min-height: 30px;
padding: 0 12px;
margin-bottom: 18px;
border: 1px solid rgba(8, 145, 178, 0.25);
background: rgba(8, 145, 178, 0.08);
color: #0e7490;
font-size: 12px;
}
.icon {
width: 44px;
height: 44px;
margin-bottom: 18px;
border: 1px solid rgba(37, 99, 235, 0.18);
background: rgba(37, 99, 235, 0.08);
color: var(--accent);
font-size: 13px;
}
.work-card {
overflow: hidden;
}
.work-card img {
display: block;
width: 100%;
aspect-ratio: 16 / 10;
object-fit: cover;
border-bottom: 1px solid var(--border);
}
.work-body {
padding: 24px;
}
.text-link {
display: inline-flex;
margin-top: 10px;
color: var(--accent);
font-size: 14px;
font-weight: 700;
text-decoration: none;
}
.text-link:hover {
color: #1e40af;
text-decoration: underline;
text-underline-offset: 4px;
}
.steps {
display: grid;
gap: 18px;
margin: 32px 0 0;
padding: 0;
list-style: none;
counter-reset: step;
}
.steps li {
display: grid;
grid-template-columns: auto 1fr;
gap: 18px;
align-items: start;
padding: 24px;
}
.steps li::before {
display: grid;
width: 40px;
height: 40px;
place-items: center;
border-radius: 8px;
background: #0f172a;
color: #fff;
counter-increment: step;
content: counter(step);
font-weight: 800;
}
.faq {
margin: 0;
padding: 0;
list-style: none;
}
.faq p {
margin-bottom: 0;
}
.cta-band {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
padding: 30px;
background: #0f172a;
color: #fff;
}
.cta-band h2,
.cta-band p {
color: #fff;
}
.cta-band p {
max-width: 620px;
margin-bottom: 0;
opacity: 0.82;
}
.cta-band .btn-secondary {
border-color: rgba(255, 255, 255, 0.28);
background: rgba(255, 255, 255, 0.08);
color: #fff;
}
.cta-band .btn-secondary:hover {
border-color: rgba(255, 255, 255, 0.5);
color: #fff;
}
@media (max-width: 920px) {
main {
padding: 18px 16px 56px;
}
.nav,
.section-head,
.cta-band {
align-items: flex-start;
flex-direction: column;
}
.hero {
grid-template-columns: 1fr;
gap: 28px;
}
.model-grid,
.feature-grid,
.work-grid {
grid-template-columns: 1fr;
}
.proof {
grid-template-columns: 1fr;
}
}
@media (max-width: 620px) {
h1 {
font-size: 38px;
line-height: 1.1;
}
h2 {
font-size: 28px;
}
.nav-links {
gap: 12px;
}
.hero-panel-caption {
display: none;
}
.btn {
width: 100%;
}
.steps li {
grid-template-columns: 1fr;
}
}
</style>
</head>
<body>
<main>
<nav class="nav" aria-label="Main navigation">
<a class="brand" href="/" aria-label="Open the TrueGrowth workspace">
<img
class="brand-logo"
src="/icons/icon-96x96.png"
alt="TrueGrowth logo"
width="42"
height="42"
/>
<span>TrueGrowth</span>
</a>
<div class="nav-links">
<a
href="#models"
data-seo-track="home_nav_click"
data-seo-target="models"
>Models</a
>
<a
href="#works"
data-seo-track="home_nav_click"
data-seo-target="works"
>Use cases</a
>
<a
href="#workflow"
data-seo-track="home_nav_click"
data-seo-target="workflow"
>Workflow</a
>
<a
href="/user-manual/index.html"
data-seo-track="home_nav_click"
data-seo-target="manual"
>Guide</a
>
<a
href="/home.html"
hreflang="zh-CN"
lang="zh-CN"
data-seo-track="home_nav_click"
data-seo-target="chinese_home"
>中文</a
>
</div>
</nav>
<section class="hero">
<div class="hero-copy">
<h1>TrueGrowth: AI canvas workspace</h1>
<p class="lead">
TrueGrowth brings AI image generation, prompt reasoning, flowcharts,
mind maps, and reusable assets into one browser canvas, so every
idea can become a structured workflow you can use online or
self-host.
</p>
<ul class="proof" aria-label="TrueGrowth core strengths">
<li class="proof-item">
<span class="proof-value">Open canvas</span>
<span class="proof-label"
>Use it online or adapt it for your own creative workspace</span
>
</li>
<li class="proof-item">
<span class="proof-value">AI workflow</span>
<span class="proof-label"
>Connect image generation, prompts, and multimodal tasks</span
>
</li>
<li class="proof-item">
<span class="proof-value">Structured work</span>
<span class="proof-label"
>Keep diagrams, mind maps, assets, and notes in one place</span
>
</li>
</ul>
<div class="cta-row">
<a
class="btn btn-primary"
href="/"
data-seo-track="home_cta_click"
data-seo-target="open_workspace"
data-seo-position="hero"
>Open workspace</a
>
<a
class="btn btn-secondary"
href="/user-manual/index.html"
data-seo-track="home_cta_click"
data-seo-target="manual"
data-seo-position="hero"
>Read guide</a
>
</div>
</div>
<aside class="hero-panel">
<div class="hero-panel-caption">
<strong>Creative work stays in context</strong>
<span>Generated results, references, and decisions stay together.</span>
</div>
<img
src="/product_showcase/九宫格拆图.gif"
alt="TrueGrowth AI image generation and canvas workspace demo"
/>
</aside>
</section>
<section class="section" id="models">
<div class="section-head">
<div>
<h2>Turn AI models into a continuous creative workflow</h2>
<p class="section-lead">
Image models produce visual options. Reasoning models clarify
ideas and structure. TrueGrowth connects both inside the same AI
canvas workspace: plan, generate, compare, and organize without
losing the creative thread.
</p>
</div>
</div>
<div class="model-grid">
<article
class="model-panel"
data-seo-track="home_model_card_click"
data-seo-target="gpt-image-2"
>
<span class="tag">Image creation</span>
<strong>GPT-Image-2</strong>
<p class="model-note">
Create covers, posters, character concepts, product visuals,
social media images, and inspiration sketches. Generated results
go straight onto the canvas for comparison, selection, and reuse.
</p>
</article>
<article
class="model-panel"
data-seo-track="home_model_card_click"
data-seo-target="deepseek-v4"
>
<span class="tag">Prompt reasoning</span>
<strong>DeepSeek-v4</strong>
<p class="model-note">
Expand prompts, draft copy, break down requirements, plan
storyboards, and turn rough ideas into structured content before
you move into visual generation.
</p>
</article>
</div>
</section>
<section class="section">
<div class="section-head">
<div>
<h2>TrueGrowth fixes three common creative gaps</h2>
<p class="section-lead">
AI generation often fails after the output is created: files get
scattered, context disappears, and useful assets are hard to reuse.
TrueGrowth keeps generation, organization, and delivery in one flow.
</p>
</div>
</div>
<div class="feature-grid">
<article class="card">
<span class="icon">01</span>
<h3>Outputs stay organized</h3>
<p>
Store prompts, references, candidates, and final versions on one
canvas so the path behind each result remains visible.
</p>
</article>
<article class="card">
<span class="icon">02</span>
<h3>Ideas become structure</h3>
<p>
Turn creative directions, scripts, decisions, and task breakdowns
into flowcharts or mind maps for clearer execution.
</p>
</article>
<article class="card">
<span class="icon">03</span>
<h3>Assets become reusable</h3>
<p>
Keep generated images, references, screenshots, and project notes
ready for the next cover, tutorial, campaign, or presentation.
</p>
</article>
</div>
</section>
<section class="section" id="works">
<div class="section-head">
<div>
<h2>What you can create with TrueGrowth</h2>
<p class="section-lead">
From AI image boards to project planning, TrueGrowth preserves both
process and result. Every image, prompt, note, and revision can
become material for the next creative cycle.
</p>
</div>
</div>
<div class="work-grid">
<article
class="work-card"
data-seo-track="home_work_card_click"
data-seo-target="image_split"
>
<img
src="/product_showcase/九宫格拆图.gif"
alt="TrueGrowth AI image board with generated image candidates"
loading="lazy"
/>
<div class="work-body">
<h3>AI image boards</h3>
<p>
Generate multiple visual candidates, sort them by theme or
style, and quickly decide which version is ready to deliver.
</p>
<a
class="text-link"
href="/user-manual/ai-generation-image-generation.html"
data-seo-track="home_work_card_click"
data-seo-target="image_generation_manual"
>Read the AI image guide</a
>
</div>
</article>
<article
class="work-card"
data-seo-track="home_work_card_click"
data-seo-target="flowchart"
>
<img
src="/product_showcase/流程图.gif"
alt="TrueGrowth flowchart and project planning demo"
loading="lazy"
/>
<div class="work-body">
<h3>Flowcharts and planning</h3>
<p>
Convert steps, requirements, and decision paths into clear
diagrams that make complex projects easier to understand.
</p>
<a
class="text-link"
href="/user-manual/drawing-flowchart.html"
data-seo-track="home_work_card_click"
data-seo-target="flowchart_manual"
>Read the flowchart guide</a
>
</div>
</article>
<article
class="work-card"
data-seo-track="home_work_card_click"
data-seo-target="mindmap"
>
<img
src="/product_showcase/思维导图.gif"
alt="TrueGrowth mind map and knowledge organization demo"
loading="lazy"
/>
<div class="work-body">
<h3>Mind maps and knowledge</h3>
<p>
Collect prompts, references, model outputs, and final assets in
one place to build your own creative knowledge base.
</p>
<a
class="text-link"
href="/user-manual/drawing-mindmap.html"
data-seo-track="home_work_card_click"
data-seo-target="mindmap_manual"
>Read the mind map guide</a
>
</div>
</article>
</div>
</section>
<section class="section" id="workflow">
<div class="section-head">
<div>
<h2>Start an TrueGrowth workflow in three steps</h2>
<p class="section-lead">
No heavy setup is required. Open the canvas, describe the task,
generate results, and organize the outcome into a reusable project.
</p>
</div>
</div>
<ol class="steps">
<li>
<div>
<h3>Choose a model and task</h3>
<p class="model-note">
Select image, text, or video generation, or connect an
OpenAI-compatible model provider for your own workflow.
</p>
</div>
</li>
<li>
<div>
<h3>Generate and compare on the canvas</h3>
<p class="model-note">
Place generated images, references, notes, and diagrams in the
same space so you can compare versions and keep iterating.
</p>
</div>
</li>
<li>
<div>
<h3>Organize the final project</h3>
<p class="model-note">
Save final images, prompts, design notes, and diagrams together
as a project canvas that can be shared or reused.
</p>
</div>
</li>
</ol>
</section>
<section class="section" id="faq">
<div class="section-head">
<div>
<h2>Frequently asked questions</h2>
<p class="section-lead">
If you are looking for an AI image generation workspace or an
AI whiteboard, these answers cover the basics.
</p>
</div>
</div>
<ul class="faq">
<li>
<h3>How is TrueGrowth different from a regular AI chat tool?</h3>
<p>
AI chat tools are great for conversations. TrueGrowth is built for
execution: generated images, prompts, notes, diagrams, and assets
stay together on a reusable canvas.
</p>
</li>
<li>
<h3>What AI image tasks can TrueGrowth support?</h3>
<p>
TrueGrowth is useful for covers, posters, character concepts, product
visuals, social media images, inspiration boards, and
multi-version visual exploration.
</p>
</li>
<li>
<h3>How does DeepSeek-v4 fit into TrueGrowth?</h3>
<p>
DeepSeek-v4 can help expand prompts, draft copy, break down
requirements, plan storyboards, and structure ideas before the
results are organized on the canvas.
</p>
</li>
<li>
<h3>Can TrueGrowth be customized?</h3>
<p>
Yes. TrueGrowth can be used as a dedicated AI canvas workspace and
adapted around your brand, model routing, and toolchain needs.
</p>
</li>
</ul>
</section>
<section class="section cta-band">
<div>
<h2>Open TrueGrowth and start your next AI project</h2>
<p>
Start with one image, one flow, or one idea board. TrueGrowth keeps
model outputs, references, and final work together on the canvas.
</p>
</div>
<div class="cta-actions">
<a
class="btn btn-secondary"
href="/"
data-seo-track="home_cta_click"
data-seo-target="open_workspace"
data-seo-position="bottom"
>Enter workspace</a
>
<a
class="btn btn-secondary"
href="/user-manual/index.html"
data-seo-track="home_cta_click"
data-seo-target="manual"
data-seo-position="bottom"
>Read guide</a
>
</div>
</section>
</main>
<script>
(function () {
var pageName = 'opentu_home_seo_en';
var posthogKey = 'phc_13URtidKwTR9POlwnB153NsN99shRykvPguKWf3vZVn';
var posthogHost = 'https://us.i.posthog.com';
var isLocalDev =
window.location.hostname === 'localhost' ||
window.location.hostname === '127.0.0.1';
var forceReport =
new URLSearchParams(window.location.search).get('report') === '1';
if (isLocalDev && !forceReport) {
return;
}
function sanitizeValue(value) {
return String(value || '').slice(0, 120);
}
function getSearchEngine() {
var referrer = document.referrer || '';
if (!referrer) return '';
try {
var host = new URL(referrer).hostname.toLowerCase();
if (host.indexOf('google.') !== -1) return 'google';
if (host.indexOf('bing.') !== -1) return 'bing';
if (host.indexOf('baidu.') !== -1) return 'baidu';
if (host.indexOf('duckduckgo.') !== -1) return 'duckduckgo';
if (host.indexOf('yahoo.') !== -1) return 'yahoo';
if (host.indexOf('yandex.') !== -1) return 'yandex';
return host;
} catch (error) {
return '';
}
}
function getCommonProperties() {
var params = new URLSearchParams(window.location.search);
return {
page_name: pageName,
page_path: window.location.pathname,
page_title: document.title,
page_language: 'en',
landing_page: '/en/home.html',
referrer_host: (function () {
try {
return document.referrer
? new URL(document.referrer).hostname
: '';
} catch (error) {
return '';
}
})(),
search_engine: getSearchEngine(),
utm_source: sanitizeValue(params.get('utm_source')),
utm_medium: sanitizeValue(params.get('utm_medium')),
utm_campaign: sanitizeValue(params.get('utm_campaign')),
primary_image_model: 'gpt-image-2',
primary_reasoning_model: 'deepseek-v4',
content_variant: 'home-en-2026-04-28',
};
}
function track(eventName, properties) {
if (!window.posthog || !window.posthog.capture) return;
try {
window.posthog.capture(
eventName,
Object.assign(getCommonProperties(), properties || {})
);
} catch (error) {
void error;
}
}
function initAnalytics() {
!(function (t, e) {
var o, n, p, r;
e.__SV ||
(window.posthog && window.posthog.__loaded) ||
((window.posthog = e),
(e._i = []),
(e.init = function (i, s, a) {
function g(t, e) {
var o = e.split('.');
2 == o.length && ((t = t[o[0]]), (e = o[1])),
(t[e] = function () {
t.push(
[e].concat(Array.prototype.slice.call(arguments, 0))
);
});
}
((p = t.createElement('script')).type = 'text/javascript'),
(p.crossOrigin = 'anonymous'),
(p.async = !0),
(p.src =
s.api_host.replace(
'.i.posthog.com',
'-assets.i.posthog.com'
) + '/static/array.js'),
(r =
t.getElementsByTagName(
'script'
)[0]).parentNode.insertBefore(p, r);
var u = e;
for (
void 0 !== a ? (u = e[a] = []) : (a = 'posthog'),
u.people = u.people || [],
u.toString = function (t) {
var e = 'posthog';
return (
'posthog' !== a && (e += '.' + a),
t || (e += ' (stub)'),
e
);
},
u.people.toString = function () {
return u.toString(1) + '.people (stub)';
},
o =
'init capture register register_once unregister identify reset get_distinct_id get_session_id opt_in_capturing opt_out_capturing has_opted_in_capturing has_opted_out_capturing'.split(
' '
),
n = 0;
n < o.length;
n++
)
g(u, o[n]);
e._i.push([i, s, a]);
}),
(e.__SV = 1));
})(document, window.posthog || []);
window.posthog.init(posthogKey, {
api_host: posthogHost,
defaults: '2025-11-30',
person_profiles: 'identified_only',
disable_session_recording: true,
autocapture: false,
capture_pageview: false,
rate_limiting: { events_per_second: 5, events_burst_limit: 15 },
request_queue: { flush_interval_ms: 2000 },
});
clearHomeSuperProperties();
}
function clearHomeSuperProperties() {
if (!window.posthog || !window.posthog.unregister) return;
[
'page_name',
'page_path',
'page_title',
'page_language',
'landing_page',
'referrer_host',
'search_engine',
'utm_source',
'utm_medium',
'utm_campaign',
'primary_image_model',
'primary_reasoning_model',
'content_variant',
].forEach(function (key) {
try {
window.posthog.unregister(key);
} catch (error) {
void error;
}
});
}
function scheduleWhenIdle(callback, timeout) {
if ('requestIdleCallback' in window) {
window.requestIdleCallback(callback, { timeout: timeout || 4000 });
return;
}
window.setTimeout(callback, Math.min(timeout || 4000, 1200));
}
function registerHomeServiceWorker() {
if (!('serviceWorker' in navigator)) return;
scheduleWhenIdle(function () {
var startedAt = Date.now();
navigator.serviceWorker
.register('/sw.js')
.then(function (registration) {
track('home_sw_register_success', {
sw_scope: registration.scope,
has_controller: !!navigator.serviceWorker.controller,
duration_ms: Date.now() - startedAt,
});
})
.catch(function (error) {
track('home_sw_register_failed', {
error: sanitizeValue(error && error.message),
duration_ms: Date.now() - startedAt,
});
});
}, 4500);
}
initAnalytics();
registerHomeServiceWorker();
track('home_seo_pageview', {
viewport_width: window.innerWidth,
viewport_height: window.innerHeight,
});
document.addEventListener(
'click',
function (event) {
var target =
event.target && event.target.closest('[data-seo-track]');
if (!target) return;
track(target.getAttribute('data-seo-track'), {
target: sanitizeValue(target.getAttribute('data-seo-target')),
position: sanitizeValue(target.getAttribute('data-seo-position')),
text: sanitizeValue(target.textContent),
href: sanitizeValue(target.getAttribute('href')),
});
},
true
);
var reportedDepths = {};
function reportScrollDepth() {
var doc = document.documentElement;
var scrollTop = window.scrollY || doc.scrollTop || 0;
var scrollable = Math.max(1, doc.scrollHeight - window.innerHeight);
var depth = Math.min(100, Math.round((scrollTop / scrollable) * 100));
[25, 50, 75, 90].forEach(function (threshold) {
if (depth >= threshold && !reportedDepths[threshold]) {
reportedDepths[threshold] = true;
track('home_seo_scroll_depth', { depth_percent: threshold });
}
});
}
var scrollTimer = 0;
window.addEventListener(
'scroll',
function () {
if (scrollTimer) return;
scrollTimer = window.setTimeout(function () {
scrollTimer = 0;
reportScrollDepth();
}, 250);
},
{ passive: true }
);
})();
</script>
</body>
</html>