Skip to content

Commit 57496aa

Browse files
SeanLuisSeanLuis
committed
Simplify LLM optimization section and add ROI callout
1 parent afb2e92 commit 57496aa

File tree

1 file changed

+27
-111
lines changed

1 file changed

+27
-111
lines changed

‎docs/index.html‎

Lines changed: 27 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -630,122 +630,38 @@ <h3 class="text-sm font-semibold">Smart Patterns</h3>
630630
</div>
631631
</section>
632632

633-
<!-- LLM Optimization Features -->
633+
<!-- LLM Optimization -->
634634
<section class="border-t pt-12 pb-8">
635-
<h2 class="text-lg font-semibold mb-4">Why ASON Format is Optimal for LLMs</h2>
636-
<p class="text-sm text-gray-600 mb-6">
637-
ASON uses <code class="bg-gray-100 px-1 rounded">$def</code> + pipe delimiters, which is significantly better than comma-based formats for language model processing.
638-
</p>
639-
640-
<!-- Comparison: ASON vs Comma-based -->
641-
<div class="border rounded-lg overflow-hidden mb-6">
642-
<div class="px-4 py-2 bg-gray-50 border-b">
643-
<h3 class="text-sm font-semibold">Format Comparison</h3>
644-
</div>
645-
<div class="grid grid-cols-1 md:grid-cols-2 gap-0 divide-x">
646-
<div class="p-4">
647-
<div class="text-xs font-semibold text-green-700 mb-2">✓ ASON Format (Recommended)</div>
648-
<pre class="bg-gray-50 p-3 rounded text-xs font-mono overflow-auto"><span class="bg-gray-200 text-gray-900 px-1 rounded">$def:</span>
649-
<span class="bg-green-100 text-green-900 px-1 rounded">$category</span>:Electronics
650-
651-
<span class="bg-gray-200 text-gray-900 px-1 rounded">$data:</span>
652-
products:<span class="bg-blue-100 text-blue-900 px-1 rounded">[3]{id,name,price,category}</span>
653-
1|"Product 1"|10.99|<span class="bg-green-100 text-green-900 px-1 rounded">$category</span>
654-
2|"Product 2"|21.98|"Clothing"
655-
3|"Product 3"|32.97|"Food"</pre>
656-
</div>
657-
<div class="p-4">
658-
<div class="text-xs font-semibold text-red-700 mb-2">✗ Comma-based Format</div>
659-
<pre class="bg-gray-50 p-3 rounded text-xs font-mono overflow-auto">products[3]{id,name,price,category}:
660-
1,Product 1,10.99,Electronics
661-
2,Product 2,21.98,Clothing
662-
3,Product 3,32.97,Food</pre>
663-
<p class="text-xs text-gray-600 mt-2">Issues: Commas ambiguous, no quotes, repetitive values</p>
664-
</div>
665-
</div>
666-
</div>
667-
668-
<!-- Key Advantages -->
669-
<div class="border rounded-lg overflow-hidden mb-6">
670-
<div class="px-4 py-2 bg-gray-50 border-b">
671-
<h3 class="text-sm font-semibold">Why ASON Wins for LLMs</h3>
672-
</div>
673-
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 p-6">
674-
<!-- Pipe Delimiters -->
675-
<div>
676-
<h3 class="text-sm font-semibold mb-2">1. Unambiguous Pipe Delimiters</h3>
677-
<p class="text-xs text-gray-600 mb-3 leading-relaxed">
678-
Commas appear everywhere: numbers (1,000), dates, text. Pipes (<code class="bg-gray-100 px-1 rounded">|</code>) are rare and unambiguous.
679-
</p>
680-
<div class="bg-gray-50 rounded p-3 text-xs font-mono space-y-1">
681-
<div><span class="text-green-600">✓</span> <code>1|"Product 1"|10.99</code> <span class="text-gray-500">← clear boundaries</span></div>
682-
<div><span class="text-red-600">✗</span> <code>1,Product 1,10.99</code> <span class="text-gray-500">← is it 2 or 3 fields?</span></div>
683-
</div>
684-
</div>
685-
686-
<!-- Explicit Strings -->
687-
<div>
688-
<h3 class="text-sm font-semibold mb-2">2. Explicit String Boundaries</h3>
689-
<p class="text-xs text-gray-600 mb-3 leading-relaxed">
690-
Quoted strings prevent type confusion. LLMs know exactly where text starts/ends.
691-
</p>
692-
<div class="bg-gray-50 rounded p-3 text-xs font-mono space-y-1">
693-
<div><span class="text-green-600">✓</span> <code>"Product 1"</code> <span class="text-gray-500">← clearly a string</span></div>
694-
<div><span class="text-green-600">✓</span> <code>false</code> <span class="text-gray-500">← clearly a boolean</span></div>
695-
<div><span class="text-red-600">✗</span> <code>Product 1</code> <span class="text-gray-500">← string or identifier?</span></div>
696-
</div>
697-
</div>
698-
699-
<!-- References -->
700-
<div>
701-
<h3 class="text-sm font-semibold mb-2">3. Reusable References Save Tokens</h3>
702-
<p class="text-xs text-gray-600 mb-3 leading-relaxed">
703-
Define once, reference many times. Crucial for LLM context windows.
704-
</p>
705-
<div class="bg-gray-50 rounded p-3 text-xs font-mono">
706-
<div><span class="bg-gray-200 text-gray-900 px-1 rounded">$def:</span> <span class="bg-green-100 text-green-900 px-1 rounded">$cat</span>:Electronics</div>
707-
<div class="text-gray-500 mt-1">→ Reused 17× saves ~30% tokens</div>
708-
<div class="text-gray-500">→ Less repetition = less errors</div>
709-
</div>
710-
</div>
711-
712-
<!-- Section Boundaries -->
713-
<div>
714-
<h3 class="text-sm font-semibold mb-2">4. Clear Section Boundaries</h3>
715-
<p class="text-xs text-gray-600 mb-3 leading-relaxed">
716-
Explicit markers help LLMs understand structure at a glance.
717-
</p>
718-
<div class="bg-gray-50 rounded p-3 text-xs font-mono space-y-1">
719-
<div><span class="bg-gray-200 text-gray-900 px-1 rounded">$def:</span> <span class="text-gray-500">← define variables here</span></div>
720-
<div><span class="bg-gray-200 text-gray-900 px-1 rounded">$data:</span> <span class="text-gray-500">← actual data here</span></div>
635+
<!-- ROI Callout -->
636+
<div class="mt-6 border-2 border-blue-200 rounded-lg overflow-hidden bg-gradient-to-r from-blue-50 to-indigo-50">
637+
<div class="p-6">
638+
<div class="flex items-start gap-4">
639+
<div class="w-12 h-12 rounded-lg bg-blue-600 flex items-center justify-center flex-shrink-0">
640+
<i data-lucide="trending-down" class="w-6 h-6 text-white"></i>
641+
</div>
642+
<div class="flex-1">
643+
<h3 class="text-base font-semibold text-gray-900 mb-2">Lower Costs, Better Results</h3>
644+
<p class="text-sm text-gray-700 leading-relaxed mb-3">
645+
Every token saved is money saved. ASON's design makes it easier for LLMs to parse correctly—reducing errors and improving response quality while cutting your API bills by 20-60%.
646+
</p>
647+
<div class="flex flex-wrap gap-4 text-xs">
648+
<div class="flex items-center gap-2">
649+
<div class="w-2 h-2 rounded-full bg-green-500"></div>
650+
<span class="text-gray-600">Fewer hallucinations</span>
651+
</div>
652+
<div class="flex items-center gap-2">
653+
<div class="w-2 h-2 rounded-full bg-green-500"></div>
654+
<span class="text-gray-600">More context in prompts</span>
655+
</div>
656+
<div class="flex items-center gap-2">
657+
<div class="w-2 h-2 rounded-full bg-green-500"></div>
658+
<span class="text-gray-600">Faster responses</span>
659+
</div>
660+
</div>
721661
</div>
722662
</div>
723663
</div>
724664
</div>
725-
726-
<!-- Future Enhancement: Schema -->
727-
<div class="border border-blue-200 rounded-lg overflow-hidden bg-blue-50">
728-
<div class="px-4 py-2 bg-blue-100 border-b border-blue-200">
729-
<h3 class="text-sm font-semibold text-blue-900">Future Enhancement: Type Schemas</h3>
730-
</div>
731-
<div class="p-4">
732-
<p class="text-xs text-blue-900 mb-3 leading-relaxed">
733-
A proposed <code class="bg-white px-1 rounded">$schema:</code> section would make types even more explicit for LLMs:
734-
</p>
735-
<pre class="bg-white p-3 rounded text-xs font-mono overflow-auto border border-blue-200"><span class="bg-gray-200 text-gray-900 px-1 rounded">$def:</span>
736-
<span class="bg-green-100 text-green-900 px-1 rounded">$category</span>:Electronics
737-
738-
<span class="bg-blue-200 text-blue-900 px-1 rounded">$schema:</span>
739-
products[10]:{id:int,name:str,price:float,inStock:bool,category:str}
740-
741-
<span class="bg-gray-200 text-gray-900 px-1 rounded">$data:</span>
742-
1|"Product 1"|10.99|false|<span class="bg-green-100 text-green-900 px-1 rounded">$category</span>
743-
2|"Product 2"|21.98|true|"Clothing"</pre>
744-
<p class="text-xs text-blue-800 mt-3">
745-
This would provide complete type information, making ASON even easier for LLMs to understand and generate correctly.
746-
</p>
747-
</div>
748-
</div>
749665
</section>
750666

751667
<!-- FAQs Section -->

0 commit comments

Comments
 (0)