adiuvAI/workspace
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
596e5551f8b1019d44d13f449b055520a8ecab3b
workspace/docs/llm-provider-report.html

1565 lines
68 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Report Provider LLM per adiuvAI — Aprile 2026</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Outfit:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet" />
<style>
:root {
--bg: #0a0b10;
--bg-2: #0e1017;
--surface: #13151e;
--surface-2: #1a1d2a;
--surface-3: #222639;
--ink: #e8eaf0;
--ink-2: #9ca0b4;
--ink-3: #5d6180;
--accent-1: #6366f1;
--accent-2: #8b5cf6;
--accent-3: #a78bfa;
--grad-1: linear-gradient(135deg, #6366f1, #8b5cf6, #c084fc);
--grad-2: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #ec4899 100%);
--grad-subtle: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(139,92,246,0.08));
--green: #34d399;
--green-bg: rgba(52,211,153,0.1);
--green-border: rgba(52,211,153,0.25);
--red: #f87171;
--red-bg: rgba(248,113,113,0.1);
--red-border: rgba(248,113,113,0.25);
--warn: #fbbf24;
--warn-bg: rgba(251,191,36,0.1);
--warn-border: rgba(251,191,36,0.25);
--blue: #60a5fa;
--border: rgba(255,255,255,0.06);
--border-2: rgba(255,255,255,0.1);
--radius: 14px;
--radius-sm: 8px;
--shadow: 0 4px 32px rgba(0,0,0,0.4);
--shadow-glow: 0 0 60px rgba(99,102,241,0.15);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
font-family: 'Outfit', sans-serif;
background: var(--bg);
color: var(--ink);
font-size: 15px;
line-height: 1.7;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
}
/* ── NOISE OVERLAY ──────────────────────────── */
body::before {
content: '';
position: fixed;
inset: 0;
z-index: 0;
opacity: 0.03;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
pointer-events: none;
}
/* ── LAYOUT ──────────────────────────────────── */
.wrap { max-width: 1100px; margin: 0 auto; padding: 0 28px; position: relative; z-index: 1; }
section { padding: 80px 0; }
/* ── TYPOGRAPHY ──────────────────────────────── */
h1, h2, h3 { font-family: 'Instrument Serif', serif; font-weight: 400; }
h1 { font-size: clamp(2.4rem, 5vw, 3.6rem); line-height: 1.1; letter-spacing: -0.02em; }
h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1.2; letter-spacing: -0.01em; margin-bottom: 12px; }
h3 { font-size: 1.25rem; line-height: 1.3; }
.mono { font-family: 'IBM Plex Mono', monospace; }
.label {
font-family: 'Outfit', sans-serif;
font-size: 0.7rem;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--accent-3);
}
.subtitle { color: var(--ink-2); font-size: 1.05rem; font-weight: 300; max-width: 600px; }
/* ── GRADIENT TEXT ───────────────────────────── */
.grad-text {
background: var(--grad-1);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
/* ── ANIMATIONS ──────────────────────────────── */
@keyframes fadeUp {
from { opacity: 0; transform: translateY(28px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
@keyframes shimmer {
0% { background-position: -200% 0; }
100% { background-position: 200% 0; }
}
@keyframes pulse-glow {
0%, 100% { opacity: 0.4; }
50% { opacity: 0.8; }
}
.reveal {
opacity: 0;
transform: translateY(28px);
transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible {
opacity: 1;
transform: translateY(0);
}
/* ── HEADER ──────────────────────────────────── */
header {
position: relative;
padding: 100px 0 60px;
overflow: hidden;
}
header::before {
content: '';
position: absolute;
top: -200px;
left: 50%;
transform: translateX(-50%);
width: 800px;
height: 800px;
background: radial-gradient(ellipse, rgba(99,102,241,0.12) 0%, rgba(139,92,246,0.06) 40%, transparent 70%);
pointer-events: none;
animation: pulse-glow 6s ease-in-out infinite;
}
.header-badge {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 6px 16px;
border-radius: 100px;
background: rgba(99,102,241,0.1);
border: 1px solid rgba(99,102,241,0.2);
font-size: 0.78rem;
font-weight: 500;
color: var(--accent-3);
margin-bottom: 28px;
animation: fadeUp 0.6s ease both;
}
.header-badge .dot {
width: 6px; height: 6px; border-radius: 50%;
background: var(--green);
box-shadow: 0 0 8px var(--green);
}
header h1 { animation: fadeUp 0.6s ease 0.1s both; }
header .subtitle { animation: fadeUp 0.6s ease 0.2s both; margin-top: 16px; }
.header-note {
margin-top: 24px;
padding: 12px 20px;
background: var(--surface);
border: 1px solid var(--border-2);
border-radius: var(--radius-sm);
font-size: 0.85rem;
color: var(--ink-2);
display: inline-flex;
align-items: center;
gap: 10px;
animation: fadeUp 0.6s ease 0.3s both;
}
.header-note .icon { font-size: 1.1rem; }
/* ── DIVIDER ─────────────────────────────────── */
.divider {
height: 1px;
background: linear-gradient(90deg, transparent, var(--border-2), transparent);
margin: 0;
}
/* ── SECTION HEADERS ─────────────────────────── */
.section-head { margin-bottom: 40px; }
.section-head .label { margin-bottom: 10px; }
/* ── FEATURE CARDS ───────────────────────────── */
.features-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 16px;
}
.feature-card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 28px;
transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s;
position: relative;
overflow: hidden;
}
.feature-card::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0;
height: 2px;
background: var(--grad-1);
opacity: 0;
transition: opacity 0.3s;
}
.feature-card:hover {
border-color: rgba(99,102,241,0.3);
transform: translateY(-2px);
box-shadow: var(--shadow-glow);
}
.feature-card:hover::before { opacity: 1; }
.feature-icon {
width: 44px; height: 44px;
border-radius: 12px;
display: flex; align-items: center; justify-content: center;
font-size: 1.3rem;
margin-bottom: 16px;
background: var(--grad-subtle);
border: 1px solid rgba(99,102,241,0.15);
}
.feature-card h3 { margin-bottom: 8px; color: var(--ink); }
.feature-card p { font-size: 0.88rem; color: var(--ink-2); line-height: 1.6; margin-bottom: 14px; }
.feature-reqs {
display: flex; flex-wrap: wrap; gap: 6px;
}
.req-tag {
font-size: 0.7rem;
font-weight: 500;
padding: 3px 10px;
border-radius: 100px;
background: rgba(99,102,241,0.08);
color: var(--accent-3);
border: 1px solid rgba(99,102,241,0.12);
}
/* ── TABLES ──────────────────────────────────── */
.table-wrap {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
}
.table-wrap + .table-wrap { margin-top: 28px; }
.table-header {
padding: 20px 28px;
background: var(--surface-2);
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 12px;
}
.table-header h3 { font-size: 1.1rem; }
.table-header .desc {
font-size: 0.82rem;
color: var(--ink-3);
font-weight: 400;
font-family: 'Outfit', sans-serif;
}
table {
width: 100%;
border-collapse: collapse;
font-size: 0.88rem;
}
thead { background: var(--surface-2); }
th {
padding: 12px 20px;
text-align: left;
font-weight: 600;
font-size: 0.72rem;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--ink-3);
border-bottom: 1px solid var(--border);
}
td {
padding: 14px 20px;
border-bottom: 1px solid var(--border);
color: var(--ink-2);
vertical-align: top;
}
tr:last-child td { border-bottom: none; }
tr:hover td { background: rgba(99,102,241,0.03); }
td:first-child { font-weight: 500; color: var(--ink); }
.price { font-family: 'IBM Plex Mono', monospace; font-size: 0.85rem; font-weight: 500; color: var(--accent-3); }
.model-name { font-family: 'IBM Plex Mono', monospace; font-size: 0.82rem; color: var(--blue); }
/* ── STATUS BADGES ───────────────────────────── */
.status {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 4px 12px;
border-radius: 100px;
font-size: 0.72rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.status-ok { background: var(--green-bg); color: var(--green); border: 1px solid var(--green-border); }
.status-warn { background: var(--warn-bg); color: var(--warn); border: 1px solid var(--warn-border); }
.status-no { background: var(--red-bg); color: var(--red); border: 1px solid var(--red-border); }
.status-partial { background: var(--green-bg); color: var(--green); border: 1px solid var(--green-border); font-size: 0.68rem; }
.check { color: var(--green); }
.cross { color: var(--red); }
.warn-icon { color: var(--warn); }
/* ── COST CHART ──────────────────────────────── */
.cost-bars { display: flex; flex-direction: column; gap: 14px; padding: 28px; }
.cost-row {
display: grid;
grid-template-columns: 140px 1fr 90px;
align-items: center;
gap: 16px;
}
.cost-row .provider-name { font-weight: 500; font-size: 0.9rem; }
.cost-bar-track {
height: 32px;
background: var(--surface-2);
border-radius: 8px;
overflow: hidden;
position: relative;
}
.cost-bar-fill {
height: 100%;
border-radius: 8px;
background: var(--grad-1);
transition: width 1.2s cubic-bezier(0.22, 1, 0.36, 1);
position: relative;
min-width: 2px;
}
.cost-bar-fill.green { background: linear-gradient(135deg, #34d399, #059669); }
.cost-bar-fill.blue { background: linear-gradient(135deg, #60a5fa, #3b82f6); }
.cost-bar-fill.purple { background: var(--grad-1); }
.cost-bar-fill.amber { background: linear-gradient(135deg, #fbbf24, #d97706); }
.cost-bar-fill.pink { background: linear-gradient(135deg, #f472b6, #ec4899); }
.cost-bar-fill.teal { background: linear-gradient(135deg, #2dd4bf, #14b8a6); }
.cost-amount {
font-family: 'IBM Plex Mono', monospace;
font-weight: 500;
font-size: 0.95rem;
text-align: right;
}
.cost-amount.best { color: var(--green); }
/* ── STRATEGY CARDS ──────────────────────────── */
.strategies-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
gap: 20px;
}
.strategy-card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 32px;
position: relative;
overflow: hidden;
transition: transform 0.3s, box-shadow 0.3s;
}
.strategy-card:hover {
transform: translateY(-3px);
box-shadow: var(--shadow-glow);
}
.strategy-card.recommended {
border-color: rgba(99,102,241,0.4);
background: linear-gradient(135deg, rgba(99,102,241,0.06), rgba(139,92,246,0.04));
}
.strategy-card.recommended::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0;
height: 3px;
background: var(--grad-1);
}
.strategy-badge {
display: inline-flex;
padding: 4px 14px;
border-radius: 100px;
font-size: 0.72rem;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
margin-bottom: 16px;
}
.strategy-badge.gold { background: rgba(251,191,36,0.15); color: #fbbf24; border: 1px solid rgba(251,191,36,0.3); }
.strategy-badge.silver { background: rgba(96,165,250,0.12); color: #60a5fa; border: 1px solid rgba(96,165,250,0.25); }
.strategy-badge.bronze { background: rgba(52,211,153,0.12); color: #34d399; border: 1px solid rgba(52,211,153,0.25); }
.strategy-card h3 { margin-bottom: 16px; font-size: 1.2rem; }
.strategy-list {
list-style: none;
margin: 16px 0;
}
.strategy-list li {
padding: 8px 0;
border-bottom: 1px solid var(--border);
font-size: 0.85rem;
color: var(--ink-2);
display: flex;
justify-content: space-between;
align-items: baseline;
gap: 12px;
}
.strategy-list li:last-child { border-bottom: none; }
.strategy-list .fn { color: var(--ink); font-weight: 500; }
.strategy-list .mdl { font-family: 'IBM Plex Mono', monospace; font-size: 0.78rem; color: var(--blue); }
.strategy-cost {
margin-top: 20px;
padding: 16px 20px;
background: var(--surface-2);
border-radius: var(--radius-sm);
display: flex;
justify-content: space-between;
align-items: center;
}
.strategy-cost .cost-label { font-size: 0.82rem; color: var(--ink-3); }
.strategy-cost .cost-value {
font-family: 'IBM Plex Mono', monospace;
font-size: 1.3rem;
font-weight: 500;
}
.strategy-cost .cost-value.highlight { color: var(--green); }
.strategy-pros {
margin-top: 16px;
font-size: 0.82rem;
color: var(--ink-3);
line-height: 1.6;
}
.strategy-pros strong { color: var(--ink-2); }
/* ── WHY SECTION ─────────────────────────────── */
.why-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(480px, 1fr));
gap: 16px;
}
.why-card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 24px;
}
.why-card h4 {
font-family: 'Instrument Serif', serif;
font-weight: 400;
font-size: 1rem;
margin-bottom: 10px;
color: var(--ink);
}
.why-card p {
font-size: 0.85rem;
color: var(--ink-2);
line-height: 1.65;
}
.why-card .highlight-model {
font-family: 'IBM Plex Mono', monospace;
color: var(--accent-3);
font-size: 0.82rem;
}
/* ── NAV / TOC ───────────────────────────────── */
.toc {
position: fixed;
right: 20px;
top: 50%;
transform: translateY(-50%);
z-index: 100;
display: flex;
flex-direction: column;
gap: 6px;
}
.toc a {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--ink-3);
opacity: 0.3;
transition: opacity 0.3s, transform 0.3s, background 0.3s;
display: block;
}
.toc a:hover, .toc a.active {
opacity: 1;
background: var(--accent-1);
transform: scale(1.4);
}
/* ── FOOTER ──────────────────────────────────── */
footer {
padding: 60px 0 40px;
border-top: 1px solid var(--border);
}
footer .note {
font-size: 0.82rem;
color: var(--ink-3);
margin-bottom: 24px;
line-height: 1.7;
}
.sources-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 8px;
}
.sources-grid a {
font-size: 0.78rem;
color: var(--ink-3);
text-decoration: none;
padding: 8px 14px;
border-radius: var(--radius-sm);
background: var(--surface);
border: 1px solid var(--border);
transition: color 0.2s, border-color 0.2s;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.sources-grid a:hover { color: var(--accent-3); border-color: rgba(99,102,241,0.3); }
/* ── RESPONSIVE ──────────────────────────────── */
@media (max-width: 768px) {
.wrap { padding: 0 18px; }
section { padding: 50px 0; }
header { padding: 70px 0 40px; }
.features-grid { grid-template-columns: 1fr; }
.strategies-grid { grid-template-columns: 1fr; }
.why-grid { grid-template-columns: 1fr; }
.cost-row { grid-template-columns: 100px 1fr 70px; }
.cost-row .provider-name { font-size: 0.8rem; }
.table-wrap { border-radius: 0; border-left: none; border-right: none; }
table { font-size: 0.8rem; }
th, td { padding: 10px 12px; }
.toc { display: none; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
/* ── SCROLLBAR ────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--surface-3); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--ink-3); }
/* ── COMPARISON TABS ─────────────────────────── */
.tabs {
display: flex;
gap: 4px;
padding: 4px;
background: var(--surface);
border-radius: 12px;
border: 1px solid var(--border);
margin-bottom: 20px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.tab-btn {
padding: 10px 20px;
border: none;
background: transparent;
color: var(--ink-3);
font-family: 'Outfit', sans-serif;
font-size: 0.82rem;
font-weight: 500;
border-radius: 10px;
cursor: pointer;
white-space: nowrap;
transition: color 0.2s, background 0.2s;
}
.tab-btn:hover { color: var(--ink); }
.tab-btn.active {
background: var(--surface-3);
color: var(--ink);
}
.tab-panel { display: none; }
.tab-panel.active { display: block; }
/* ── MISC ─────────────────────────────────────── */
.na-cell { color: var(--ink-3); font-style: italic; font-size: 0.82rem; }
.flag { font-size: 1.1rem; margin-right: 2px; }
.mt-4 { margin-top: 16px; }
.mb-2 { margin-bottom: 8px; }
.text-center { text-align: center; }
</style>
</head>
<body>
<!-- TOC dots -->
<nav class="toc" aria-label="Navigazione sezioni">
<a href="#header" title="Introduzione"></a>
<a href="#features" title="Funzionalita"></a>
<a href="#privacy" title="Privacy"></a>
<a href="#comparison" title="Confronto"></a>
<a href="#costs" title="Costi"></a>
<a href="#strategy" title="Strategia"></a>
<a href="#why" title="Motivazioni"></a>
</nav>
<!-- ═══════ HEADER ═══════ -->
<header id="header">
<div class="wrap">
<div class="header-badge"><span class="dot"></span> Analisi aggiornata &mdash; Aprile 2026</div>
<h1>Report Provider LLM<br><span class="grad-text">per adiuvAI</span></h1>
<p class="subtitle">Analisi comparativa dei provider per funzionalit&agrave; agentica. Selezione ottimizzata per costo, qualit&agrave; e privacy dei dati.</p>
<div class="header-note">
<span class="icon">&#x1f512;</span>
Solo provider con policy di non-utilizzo dati utente per training dei modelli
</div>
</div>
</header>
<div class="divider"></div>
<!-- ═══════ FEATURES ═══════ -->
<section id="features">
<div class="wrap">
<div class="section-head reveal">
<p class="label">Architettura</p>
<h2>Funzionalit&agrave; Agentiche</h2>
<p class="subtitle">Sei componenti AI distinti, ognuno con requisiti specifici di modello.</p>
</div>
<div class="features-grid">
<div class="feature-card reveal">
<div class="feature-icon">&#x1f4ac;</div>
<h3>Home Chat</h3>
<p>Assistente AI interattivo con tool calling, streaming e history multi-turn. Interfaccia principale dell'app.</p>
<div class="feature-reqs">
<span class="req-tag">Function Calling</span>
<span class="req-tag">Contesto Lungo</span>
<span class="req-tag">Streaming</span>
</div>
</div>
<div class="feature-card reveal">
<div class="feature-icon">&#x1f4a0;</div>
<h3>Floating Chat</h3>
<p>Chat contestuale single-turn con navigazione automatica. Segue l'utente attraverso l'app con risposte rapide.</p>
<div class="feature-reqs">
<span class="req-tag">Function Calling</span>
<span class="req-tag">Intent Classification</span>
<span class="req-tag">Risposta Rapida</span>
</div>
</div>
<div class="feature-card reveal">
<div class="feature-icon">&#x2600;</div>
<h3>Daily Brief</h3>
<p>Sommario automatico giornaliero con 7 slot temporali. Genera brief contestuali senza interazione utente.</p>
<div class="feature-reqs">
<span class="req-tag">Output Deterministico</span>
<span class="req-tag">Velocit&agrave;</span>
<span class="req-tag">No Tool Calling</span>
</div>
</div>
<div class="feature-card reveal">
<div class="feature-icon">&#x2699;</div>
<h3>Background Agents</h3>
<p>Agenti schedulati per raccolta dati da filesystem locale e cloud (Gmail, Teams, Outlook). Loop tool-calling multi-turno, API Standard.</p>
<div class="feature-reqs">
<span class="req-tag">Tool Calling Multi-Turno</span>
<span class="req-tag">Output Strutturato</span>
<span class="req-tag">API Standard</span>
</div>
</div>
<div class="feature-card reveal">
<div class="feature-icon">&#x1f6e0;</div>
<h3>Setup Agent</h3>
<p>Journey conversazionale interattiva per configurare un agente. L&rsquo;utente risponde a domande guidate, il LLM esplora la directory e produce un <code>AgentConfig</code> JSON validato.</p>
<div class="feature-reqs">
<span class="req-tag">Conversazionale</span>
<span class="req-tag">Qualit&agrave; Linguistica</span>
<span class="req-tag">Tool Calling + Reasoning</span>
</div>
</div>
<div class="feature-card reveal">
<div class="feature-icon">&#x1f50d;</div>
<h3>Embeddings</h3>
<p>Indicizzazione vettoriale delle note per ricerca semantica. LanceDB locale con vettori 1536-dim.</p>
<div class="feature-reqs">
<span class="req-tag">1536 Dimensioni</span>
<span class="req-tag">Basso Costo</span>
<span class="req-tag">Alta Qualit&agrave;</span>
</div>
</div>
</div>
</div>
</section>
<div class="divider"></div>
<!-- ═══════ PRIVACY ═══════ -->
<section id="privacy">
<div class="wrap">
<div class="section-head reveal">
<p class="label">Conformit&agrave;</p>
<h2>Status Privacy dei Provider</h2>
<p class="subtitle">Valutazione delle policy di non-utilizzo dati per training. Solo i provider qualificati vengono considerati.</p>
</div>
<div class="table-wrap reveal">
<div class="table-scroll">
<table>
<thead>
<tr>
<th>Provider</th>
<th>Sede</th>
<th>No Training su Dati API</th>
<th>Policy</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="flag">&#127482;&#127480;</span> OpenAI</td>
<td>USA</td>
<td><span class="check">&#10003;</span> Default opt-out via API</td>
<td>Dati non usati per training. ZDR disponibile per Enterprise</td>
<td><span class="status status-ok">Qualificato</span></td>
</tr>
<tr>
<td><span class="flag">&#127482;&#127480;</span> Anthropic</td>
<td>USA</td>
<td><span class="check">&#10003;</span> Mai, senza opt-in esplicito</td>
<td>Non usa prompt/risposte per training a meno di opt-in esplicito</td>
<td><span class="status status-ok">Qualificato</span></td>
</tr>
<tr>
<td><span class="flag">&#127482;&#127480;</span> Google</td>
<td>USA</td>
<td><span class="check">&#10003;</span> Solo tier a pagamento</td>
<td>Vertex AI: garantito contrattualmente. Free tier: usato per training</td>
<td><span class="status status-partial">Qualificato (solo paid)</span></td>
</tr>
<tr>
<td><span class="flag">&#127467;&#127479;</span> Mistral</td>
<td>Francia (EU)</td>
<td><span class="check">&#10003;</span> API La Plateforme</td>
<td>Dati API non usati per training. ZDR disponibile. GDPR compliant</td>
<td><span class="status status-ok">Qualificato</span></td>
</tr>
<tr>
<td><span class="flag">&#127464;&#127475;</span> DeepSeek</td>
<td>Cina</td>
<td><span class="warn-icon">&#9888;</span> Opt-out limitato</td>
<td>Possibile opt-out via header, nessuna versione enterprise. Dati in Cina</td>
<td><span class="status status-warn">Rischio</span></td>
</tr>
<tr>
<td><span class="flag">&#127482;&#127480;</span> Groq</td>
<td>USA</td>
<td><span class="check">&#10003;</span> Via DPA separato</td>
<td>Dati API gestiti sotto Services Agreement + DPA</td>
<td><span class="status status-ok">Qualificato</span></td>
</tr>
<tr>
<td><span class="flag">&#127482;&#127480;</span> Cerebras</td>
<td>USA</td>
<td><span class="check">&#10003;</span> Nessuna conservazione</td>
<td>Dati, modelli e output mai conservati, loggati o riutilizzati</td>
<td><span class="status status-ok">Qualificato</span></td>
</tr>
<tr>
<td><span class="flag">&#127464;&#127475;</span> Zhipu (GLM)</td>
<td>Cina</td>
<td><span class="warn-icon">&#9888;</span> Non verificabile</td>
<td>Policy dichiarata ma compliance non verificabile per utenti internazionali</td>
<td><span class="status status-warn">Rischio</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
<div class="divider"></div>
<!-- ═══════ COMPARISON MATRIX ═══════ -->
<section id="comparison">
<div class="wrap">
<div class="section-head reveal">
<p class="label">Confronto Modelli</p>
<h2>Miglior Modello per Funzionalit&agrave;</h2>
<p class="subtitle">Per ogni feature, il modello ottimale di ciascun provider qualificato. Prezzi in USD per milione di token.</p>
</div>
<div class="tabs reveal">
<button class="tab-btn active" data-tab="home">Home Chat</button>
<button class="tab-btn" data-tab="floating">Floating Chat</button>
<button class="tab-btn" data-tab="brief">Daily Brief</button>
<button class="tab-btn" data-tab="batch">Background Agents</button>
<button class="tab-btn" data-tab="setup">Setup Agent</button>
<button class="tab-btn" data-tab="embed">Embeddings</button>
</div>
<!-- HOME CHAT -->
<div class="tab-panel active" id="tab-home">
<div class="table-wrap reveal">
<div class="table-header">
<div>
<h3>&#x1f4ac; Home Chat</h3>
<span class="desc">Function Calling + Streaming + Contesto Lungo</span>
</div>
</div>
<div class="table-scroll">
<table>
<thead>
<tr><th>Provider</th><th>Modello</th><th>Input $/MTok</th><th>Output $/MTok</th><th>Motivazione</th></tr>
</thead>
<tbody>
<tr>
<td>OpenAI</td>
<td><span class="model-name">GPT-4.1</span></td>
<td><span class="price">$2.00</span></td>
<td><span class="price">$8.00</span></td>
<td>Eccellente function calling, 1M context, buon rapporto qualit&agrave;/prezzo</td>
</tr>
<tr>
<td>Anthropic</td>
<td><span class="model-name">Claude Sonnet 4.6</span></td>
<td><span class="price">$3.00</span></td>
<td><span class="price">$15.00</span></td>
<td>Top tool use, 1M context, caching 90% sconto. Costoso in output</td>
</tr>
<tr style="background: rgba(52,211,153,0.04);">
<td><strong>Google</strong></td>
<td><span class="model-name">Gemini 2.5 Flash</span></td>
<td><span class="price" style="color:var(--green)">$0.30</span></td>
<td><span class="price" style="color:var(--green)">$2.50</span></td>
<td><strong>Rapporto qualit&agrave;/prezzo eccezionale</strong>, function calling nativo</td>
</tr>
<tr>
<td>Mistral</td>
<td><span class="model-name">Mistral Medium 3</span></td>
<td><span class="price">$1.00</span></td>
<td><span class="price">$3.00</span></td>
<td>Buon compromesso, EU hosting, 40% meno di GPT su output</td>
</tr>
<tr>
<td>Groq</td>
<td><span class="model-name">Llama 3.3 70B</span></td>
<td><span class="price">$0.59</span></td>
<td><span class="price">$0.79</span></td>
<td>Ultra-veloce (394 TPS), economico, buon tool use</td>
</tr>
<tr>
<td>Cerebras</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">Catalogo limitato, non adatto per chat complesso</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- FLOATING CHAT -->
<div class="tab-panel" id="tab-floating">
<div class="table-wrap reveal">
<div class="table-header">
<div>
<h3>&#x1f4a0; Floating Chat</h3>
<span class="desc">Function Calling + Intent Classification + Velocit&agrave;</span>
</div>
</div>
<div class="table-scroll">
<table>
<thead>
<tr><th>Provider</th><th>Modello</th><th>Input $/MTok</th><th>Output $/MTok</th><th>Motivazione</th></tr>
</thead>
<tbody>
<tr>
<td>OpenAI</td>
<td><span class="model-name">GPT-4.1 Mini</span></td>
<td><span class="price">$0.40</span></td>
<td><span class="price">$1.60</span></td>
<td>Veloce, economico, buon function calling</td>
</tr>
<tr>
<td>Anthropic</td>
<td><span class="model-name">Claude Haiku 4.5</span></td>
<td><span class="price">$1.00</span></td>
<td><span class="price">$5.00</span></td>
<td>Veloce, classificazione intent affidabile</td>
</tr>
<tr style="background: rgba(52,211,153,0.04);">
<td><strong>Google</strong></td>
<td><span class="model-name">Gemini 2.5 Flash-Lite</span></td>
<td><span class="price" style="color:var(--green)">$0.10</span></td>
<td><span class="price" style="color:var(--green)">$0.40</span></td>
<td><strong>Estremamente economico</strong>, veloce, sufficiente per single-turn</td>
</tr>
<tr>
<td>Mistral</td>
<td><span class="model-name">Mistral Small 3.1</span></td>
<td><span class="price">$0.20</span></td>
<td><span class="price">$0.60</span></td>
<td>Veloce ed economico, EU compliance</td>
</tr>
<tr>
<td>Groq</td>
<td><span class="model-name">Llama 4 Scout</span></td>
<td><span class="price">$0.11</span></td>
<td><span class="price">$0.34</span></td>
<td>Velocissimo (594 TPS), economico</td>
</tr>
<tr>
<td>Cerebras</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">Non adatto</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- DAILY BRIEF -->
<div class="tab-panel" id="tab-brief">
<div class="table-wrap reveal">
<div class="table-header">
<div>
<h3>&#x2600; Daily Brief</h3>
<span class="desc">Output Deterministico + Velocit&agrave;</span>
</div>
</div>
<div class="table-scroll">
<table>
<thead>
<tr><th>Provider</th><th>Modello</th><th>Input $/MTok</th><th>Output $/MTok</th><th>Motivazione</th></tr>
</thead>
<tbody>
<tr>
<td>OpenAI</td>
<td><span class="model-name">GPT-4.1 Nano</span></td>
<td><span class="price">$0.10</span></td>
<td><span class="price">$0.40</span></td>
<td>Pi&ugrave; economico OpenAI, perfetto per task deterministico</td>
</tr>
<tr>
<td>Anthropic</td>
<td><span class="model-name">Claude Haiku 4.5</span></td>
<td><span class="price">$1.00</span></td>
<td><span class="price">$5.00</span></td>
<td>Affidabile ma costoso per questo use case</td>
</tr>
<tr>
<td>Google</td>
<td><span class="model-name">Gemini 2.5 Flash-Lite</span></td>
<td><span class="price">$0.10</span></td>
<td><span class="price">$0.40</span></td>
<td>Stessa fascia di GPT-4.1 Nano, ottimo rapporto</td>
</tr>
<tr>
<td>Mistral</td>
<td><span class="model-name">Mistral Small 3.1</span></td>
<td><span class="price">$0.20</span></td>
<td><span class="price">$0.60</span></td>
<td>Economico, EU hosting</td>
</tr>
<tr style="background: rgba(52,211,153,0.04);">
<td><strong>Groq</strong></td>
<td><span class="model-name">Llama 3.1 8B</span></td>
<td><span class="price" style="color:var(--green)">$0.05</span></td>
<td><span class="price" style="color:var(--green)">$0.08</span></td>
<td><strong>Il pi&ugrave; economico in assoluto</strong>, 840 TPS</td>
</tr>
<tr>
<td>Cerebras</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- BATCH AGENTS -->
<div class="tab-panel" id="tab-batch">
<div class="table-wrap reveal">
<div class="table-header">
<div>
<h3>&#x2699; Background Agents</h3>
<span class="desc">Tool Calling Multi-Turno &mdash; API Standard (non Batch)</span>
</div>
</div>
<div style="margin: 0 0 16px; padding: 12px 18px; background: var(--warn-bg); border: 1px solid var(--warn-border); border-radius: var(--radius-sm); font-size: 0.85rem; color: var(--warn); line-height: 1.6;">
<strong>&#x26a0; Nota architetturale:</strong> Il Batch API dei provider LLM <em>non &egrave; compatibile</em> con gli agenti di processing (<code>unified-processor</code>, <code>cloud-processor</code>). Il loop di tool-calling (fino a 12 turni per file) richiede risultati sincroni dal client Electron via WebSocket — un round-trip interattivo che il Batch API asincrono non supporta. Usare esclusivamente <strong>API Standard</strong>, a prezzi di listino senza sconto batch.
</div>
<div class="table-scroll">
<table>
<thead>
<tr><th>Provider</th><th>Modello</th><th>Input $/MTok</th><th>Output $/MTok</th><th>Motivazione</th></tr>
</thead>
<tbody>
<tr style="background: rgba(52,211,153,0.04);">
<td><strong>OpenAI</strong></td>
<td><span class="model-name">GPT-4.1 Mini</span></td>
<td><span class="price" style="color:var(--green)">$0.40</span></td>
<td><span class="price" style="color:var(--green)">$1.60</span></td>
<td><strong>Ottimo rapporto qualit&agrave;/costo</strong>, tool calling affidabile, API Standard</td>
</tr>
<tr>
<td>Anthropic</td>
<td><span class="model-name">Claude Sonnet 4.6</span></td>
<td><span class="price">$3.00</span></td>
<td><span class="price">$15.00</span></td>
<td>Miglior tool use del mercato, se qualit&agrave; &egrave; priorit&agrave; assoluta</td>
</tr>
<tr>
<td>Google</td>
<td><span class="model-name">Gemini 2.5 Flash</span></td>
<td><span class="price">$0.30</span></td>
<td><span class="price">$2.50</span></td>
<td>Ottimo reasoning, tool calling affidabile, costo input molto basso</td>
</tr>
<tr>
<td>Mistral</td>
<td><span class="model-name">Mistral Large 3</span></td>
<td><span class="price">$2.00</span></td>
<td><span class="price">$6.00</span></td>
<td>Robusto, EU data residency</td>
</tr>
<tr>
<td>Groq</td>
<td><span class="model-name">Qwen3 32B</span></td>
<td><span class="price">$0.29</span></td>
<td><span class="price">$0.59</span></td>
<td>Molto economico, velocit&agrave; elevata; qualit&agrave; tool calling inferiore ai proprietari</td>
</tr>
<tr>
<td>Cerebras</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- SETUP AGENT -->
<div class="tab-panel" id="tab-setup">
<div class="table-wrap reveal">
<div class="table-header">
<div>
<h3>&#x1f6e0; Setup Agent</h3>
<span class="desc">Journey Conversazionale &mdash; Qualit&agrave; Linguistica + Reasoning</span>
</div>
</div>
<div style="margin: 0 0 16px; padding: 12px 18px; background: rgba(99,102,241,0.08); border: 1px solid rgba(99,102,241,0.25); border-radius: var(--radius-sm); font-size: 0.85rem; color: var(--accent-3); line-height: 1.6;">
<strong>&#x2139; Profilo diverso dai Background Agents:</strong> Il setup &egrave; un&rsquo;interazione <em>real-time con l&rsquo;utente</em> (3&ndash;15 turni, <code>temperature=0.4</code>). Il volume &egrave; basso (poche sessioni per utente nel tempo), quindi il costo &egrave; trascurabile anche con modelli premium. Priorit&agrave;: qualit&agrave; della conversazione e accuratezza nel produrre l&rsquo;<code>AgentConfig</code> JSON finale.
</div>
<div class="table-scroll">
<table>
<thead>
<tr><th>Provider</th><th>Modello</th><th>Input $/MTok</th><th>Output $/MTok</th><th>Motivazione</th></tr>
</thead>
<tbody>
<tr style="background: rgba(52,211,153,0.04);">
<td><strong>OpenAI</strong></td>
<td><span class="model-name">GPT-4.1</span></td>
<td><span class="price" style="color:var(--green)">$2.00</span></td>
<td><span class="price" style="color:var(--green)">$8.00</span></td>
<td><strong>Ottimo bilanciamento</strong> qualit&agrave;/costo per conversazioni guidate, JSON output affidabile</td>
</tr>
<tr>
<td>Anthropic</td>
<td><span class="model-name">Claude Sonnet 4.6</span></td>
<td><span class="price">$3.00</span></td>
<td><span class="price">$15.00</span></td>
<td>Massima qualit&agrave; conversazionale e instruction-following; costo giustificato dalla rarità delle sessioni</td>
</tr>
<tr>
<td>Google</td>
<td><span class="model-name">Gemini 2.5 Flash</span></td>
<td><span class="price">$0.30</span></td>
<td><span class="price">$2.50</span></td>
<td>Buona qualit&agrave; conversazionale a costo molto basso; opzione se si vuole contenere ogni spesa</td>
</tr>
<tr>
<td>OpenAI</td>
<td><span class="model-name">GPT-4.1 Mini</span></td>
<td><span class="price">$0.40</span></td>
<td><span class="price">$1.60</span></td>
<td>Alternativa budget; qualit&agrave; conversazionale sufficiente, JSON output meno affidabile</td>
</tr>
<tr>
<td>Mistral</td>
<td><span class="model-name">Mistral Large 3</span></td>
<td><span class="price">$2.00</span></td>
<td><span class="price">$6.00</span></td>
<td>EU data residency; buona qualit&agrave; per il setup journey</td>
</tr>
<tr>
<td>Groq / Cerebras</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">&mdash;</td>
<td class="na-cell">Non consigliati: qualit&agrave; conversazionale insufficiente per journey multi-turno</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- EMBEDDINGS -->
<div class="tab-panel" id="tab-embed">
<div class="table-wrap reveal">
<div class="table-header">
<div>
<h3>&#x1f50d; Embeddings</h3>
<span class="desc">Indicizzazione Vettoriale per Ricerca Semantica</span>
</div>
</div>
<div class="table-scroll">
<table>
<thead>
<tr><th>Provider</th><th>Modello</th><th>Costo/MTok</th><th>Dimensioni</th><th>Motivazione</th></tr>
</thead>
<tbody>
<tr style="background: rgba(52,211,153,0.04);">
<td><strong>OpenAI</strong></td>
<td><span class="model-name">text-embedding-3-small</span></td>
<td><span class="price" style="color:var(--green)">$0.02</span></td>
<td>1536</td>
<td><strong>Standard de facto</strong>, gi&agrave; in uso nell'app</td>
</tr>
<tr>
<td>Google</td>
<td><span class="model-name">Gemini Embedding</span></td>
<td><span class="price">$0.15</span></td>
<td>Variabile</td>
<td>Buona qualit&agrave; ma 7.5x pi&ugrave; costoso</td>
</tr>
<tr>
<td>Voyage AI</td>
<td><span class="model-name">voyage-3.5-lite</span></td>
<td><span class="price">$0.02</span></td>
<td>1024</td>
<td>Top qualit&agrave; al prezzo pi&ugrave; basso</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</section>
<div class="divider"></div>
<!-- ═══════ COST ESTIMATION ═══════ -->
<section id="costs">
<div class="wrap">
<div class="section-head reveal">
<p class="label">Simulazione</p>
<h2>Stima Costi Mensili per Utente</h2>
<p class="subtitle">Basata su un utilizzo tipico: 500 home, 300 floating, 210 brief, 100 background agent runs, 10 setup turns (≈2 sessioni), 1000 embeddings al mese.</p>
</div>
<div class="table-wrap reveal">
<div class="table-header">
<div>
<h3>Calcolo Dettagliato</h3>
<span class="desc">Token medi: Home 2K/1K &bull; Floating 500/300 &bull; Brief 1.5K/500 &bull; Background Agent 3K/2K &bull; Setup 4K/500 &bull; Embed 500</span>
</div>
</div>
<div class="cost-bars" id="costChart">
<!-- filled by JS -->
</div>
</div>
<div class="table-wrap reveal mt-4">
<div class="table-header">
<div>
<h3>Dettaglio per Feature &mdash; Strategia Multi-Provider Consigliata</h3>
</div>
</div>
<div class="table-scroll">
<table>
<thead>
<tr><th>Feature</th><th>Provider</th><th>Modello</th><th>Messaggi/mese</th><th>Tok Input</th><th>Tok Output</th><th>Costo/mese</th></tr>
</thead>
<tbody>
<tr>
<td>Home Chat</td>
<td>Google</td>
<td><span class="model-name">Gemini 2.5 Flash</span></td>
<td>500</td>
<td>1M</td>
<td>500K</td>
<td><span class="price">$0.30 + $1.25 = $1.55</span></td>
</tr>
<tr>
<td>Floating Chat</td>
<td>Google</td>
<td><span class="model-name">Gemini 2.5 Flash-Lite</span></td>
<td>300</td>
<td>150K</td>
<td>90K</td>
<td><span class="price">$0.015 + $0.036 = $0.05</span></td>
</tr>
<tr>
<td>Daily Brief</td>
<td>OpenAI</td>
<td><span class="model-name">GPT-4.1 Nano</span></td>
<td>210</td>
<td>315K</td>
<td>105K</td>
<td><span class="price">$0.032 + $0.042 = $0.07</span></td>
</tr>
<tr>
<td>Background Agents</td>
<td>OpenAI</td>
<td><span class="model-name">GPT-4.1 Mini</span></td>
<td>100</td>
<td>300K</td>
<td>200K</td>
<td><span class="price">$0.12 + $0.32 = $0.44</span></td>
</tr>
<tr>
<td>Setup Agent</td>
<td>OpenAI</td>
<td><span class="model-name">GPT-4.1</span></td>
<td>10 turns</td>
<td>40K</td>
<td>5K</td>
<td><span class="price">$0.08 + $0.04 = $0.12</span></td>
</tr>
<tr>
<td>Embeddings</td>
<td>OpenAI</td>
<td><span class="model-name">text-embedding-3-small</span></td>
<td>1000</td>
<td>500K</td>
<td>&mdash;</td>
<td><span class="price">$0.01</span></td>
</tr>
<tr style="background: var(--surface-2);">
<td colspan="6" style="text-align:right; font-weight:600; color:var(--ink);">Totale Mensile per Utente</td>
<td><span class="price" style="color:var(--green); font-size:1rem;">~$2.24</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
<div class="divider"></div>
<!-- ═══════ STRATEGIES ═══════ -->
<section id="strategy">
<div class="wrap">
<div class="section-head reveal">
<p class="label">Raccomandazione</p>
<h2>Strategie di Implementazione</h2>
<p class="subtitle">Tre approcci per bilanciare costo, qualit&agrave; e complessit&agrave; operativa.</p>
</div>
<div class="strategies-grid">
<!-- RECOMMENDED -->
<div class="strategy-card recommended reveal">
<span class="strategy-badge gold">&#x1f3c6; Consigliata</span>
<h3>Multi-Provider Ottimizzato</h3>
<p style="font-size:0.85rem; color:var(--ink-2); margin-bottom:8px;">Provider diversi per ogni feature, massimizzando il rapporto qualit&agrave;/costo.</p>
<ul class="strategy-list">
<li><span class="fn">Home Chat</span> <span class="mdl">Gemini 2.5 Flash</span></li>
<li><span class="fn">Floating Chat</span> <span class="mdl">Gemini 2.5 Flash-Lite</span></li>
<li><span class="fn">Daily Brief</span> <span class="mdl">GPT-4.1 Nano</span></li>
<li><span class="fn">Background Agents</span> <span class="mdl">GPT-4.1 Mini</span></li>
<li><span class="fn">Setup Agent</span> <span class="mdl">GPT-4.1</span></li>
<li><span class="fn">Embeddings</span> <span class="mdl">text-embedding-3-small</span></li>
</ul>
<div class="strategy-cost">
<span class="cost-label">Costo stimato/utente/mese</span>
<span class="cost-value highlight">~$2.24</span>
</div>
<p class="strategy-pros"><strong>Pro:</strong> Costo ottimale, qualit&agrave; massima per feature. <strong>Contro:</strong> 2 API key da gestire (Google + OpenAI).</p>
</div>
<!-- BUDGET -->
<div class="strategy-card reveal">
<span class="strategy-badge silver">&#x1f4b0; Budget</span>
<h3>Provider Singolo &mdash; Groq</h3>
<p style="font-size:0.85rem; color:var(--ink-2); margin-bottom:8px;">Tutto su Groq per risparmio massimo. Velocit&agrave; di inferenza imbattibile.</p>
<ul class="strategy-list">
<li><span class="fn">Home Chat</span> <span class="mdl">Llama 3.3 70B</span></li>
<li><span class="fn">Floating Chat</span> <span class="mdl">Llama 4 Scout</span></li>
<li><span class="fn">Daily Brief</span> <span class="mdl">Llama 3.1 8B</span></li>
<li><span class="fn">Background Agents</span> <span class="mdl">Qwen3 32B</span></li>
<li><span class="fn">Setup Agent</span> <span class="mdl">GPT-4.1 Mini</span></li>
<li><span class="fn">Embeddings</span> <span class="mdl">OpenAI (esterno)</span></li>
</ul>
<div class="strategy-cost">
<span class="cost-label">Costo stimato/utente/mese</span>
<span class="cost-value" style="color:var(--blue);">~$1.30</span>
</div>
<p class="strategy-pros"><strong>Pro:</strong> Ultra economico, velocit&agrave; record (394&ndash;840 TPS). <strong>Contro:</strong> Qualit&agrave; tool calling inferiore ai proprietari. Serve OpenAI per embeddings e setup.</p>
</div>
<!-- ENTERPRISE -->
<div class="strategy-card reveal">
<span class="strategy-badge bronze">&#x1f6e1; Enterprise</span>
<h3>Provider Singolo &mdash; OpenAI</h3>
<p style="font-size:0.85rem; color:var(--ink-2); margin-bottom:8px;">Tutto OpenAI per massima affidabilit&agrave; e semplicit&agrave; operativa.</p>
<ul class="strategy-list">
<li><span class="fn">Home Chat</span> <span class="mdl">GPT-4.1</span></li>
<li><span class="fn">Floating Chat</span> <span class="mdl">GPT-4.1 Mini</span></li>
<li><span class="fn">Daily Brief</span> <span class="mdl">GPT-4.1 Nano</span></li>
<li><span class="fn">Background Agents</span> <span class="mdl">GPT-4.1 Mini</span></li>
<li><span class="fn">Setup Agent</span> <span class="mdl">GPT-4.1</span></li>
<li><span class="fn">Embeddings</span> <span class="mdl">text-embedding-3-small</span></li>
</ul>
<div class="strategy-cost">
<span class="cost-label">Costo stimato/utente/mese</span>
<span class="cost-value" style="color:var(--warn);">~$6.85</span>
</div>
<p class="strategy-pros"><strong>Pro:</strong> Ecosistema unificato, ZDR, affidabilit&agrave; massima, 1 sola API key. <strong>Contro:</strong> Costo 3&ndash;7x superiore alle alternative.</p>
</div>
</div>
</div>
</section>
<div class="divider"></div>
<!-- ═══════ WHY SECTION ═══════ -->
<section id="why">
<div class="wrap">
<div class="section-head reveal">
<p class="label">Motivazioni</p>
<h2>Perch&eacute; queste scelte</h2>
<p class="subtitle">Analisi dettagliata delle motivazioni dietro la strategia multi-provider consigliata.</p>
</div>
<div class="why-grid">
<div class="why-card reveal">
<h4>&#x1f4ac; Gemini 2.5 Flash per Home Chat</h4>
<p>Google ha tagliato i prezzi aggressivamente nel 2026. Flash offre function calling nativo, 1M di contesto, e costa <strong>6&ndash;7x meno</strong> di Claude Sonnet per l'output. La qualit&agrave; &egrave; sufficiente per chat interattivo con tool use. Con il batch discount del 50%, diventa ancora pi&ugrave; competitivo per carichi elevati.</p>
</div>
<div class="why-card reveal">
<h4>&#x1f4a0; Gemini 2.5 Flash-Lite per Floating</h4>
<p>Per interazioni single-turn con classificazione intent, un modello leggero &egrave; pi&ugrave; che sufficiente. A <span class="highlight-model">$0.10/$0.40</span> per MTok &egrave; <strong>10x pi&ugrave; economico</strong> di Claude Haiku e 4x meno di GPT-4.1 Mini. La latenza bassissima lo rende ideale per il floating panel.</p>
</div>
<div class="why-card reveal">
<h4>&#x2600; GPT-4.1 Nano per Daily Brief</h4>
<p>Il brief &egrave; un task deterministico con prompt fisso e output breve (3&ndash;5 frasi). Nano &egrave; il modello pi&ugrave; economico di OpenAI a <span class="highlight-model">$0.10/$0.40</span> e produce output consistente di alta qualit&agrave;. Non serve function calling, quindi un modello leggero basta.</p>
</div>
<div class="why-card reveal">
<h4>&#x2699; GPT-4.1 Mini (Standard) per Background Agents</h4>
<p>Il Batch API dei provider LLM <strong>non &egrave; applicabile</strong> agli agenti di processing: il loop tool-calling (<code>unified-processor</code>, <code>cloud-processor</code>) richiede fino a 12 turni sincroni per file, con ogni risultato di tool restituito dal client Electron via WebSocket prima che parta il turno successivo — incompatibile con il modello asincrono e fire-and-forget del Batch API. Si usa quindi l&rsquo;<strong>API Standard</strong>. GPT-4.1 Mini a <span class="highlight-model">$0.40/$1.60</span> offre un ottimo bilanciamento: tool calling affidabile per operazioni CRUD multi-step, output strutturato consistente, e costo contenuto che non subisce la moltiplicazione del loop (ogni file pu&ograve; generare pi&ugrave; chiamate LLM in sequenza).</p>
</div>
<div class="why-card reveal">
<h4>&#x1f6e0; GPT-4.1 per Setup Agent</h4>
<p>Il setup journey &egrave; fondamentalmente diverso dagli agenti di processing: &egrave; una <strong>conversazione interattiva real-time</strong> con l&rsquo;utente (3&ndash;15 turni, <code>temperature=0.4</code>) che deve guidare con domande sensate, esplorare la directory con tool calling e produrre un <code>AgentConfig</code> JSON valido alla fine. GPT-4.1 a <span class="highlight-model">$2.00/$8.00</span> &egrave; la scelta giusta: qualit&agrave; conversazionale e instruction-following superiori a Mini, con un impatto sul costo <strong>trascurabile</strong> dato il basso volume (≈2 sessioni/mese per utente). Usare GPT-4.1 Mini per risparmiare $0.09/mese non vale la degradazione nell&rsquo;UX del setup.</p>
</div>
<div class="why-card reveal">
<h4>&#x1f6ab; DeepSeek e GLM Esclusi</h4>
<p>Nonostante i costi bassissimi (DeepSeek V3 a $0.28/$0.42), entrambi i provider cinesi presentano <strong>rischi di privacy non accettabili</strong> per un'app che gestisce dati personali e aziendali. DeepSeek non offre versione enterprise e i dati risiedono in Cina. GLM ha policy non verificabili per utenti internazionali.</p>
</div>
<div class="why-card reveal">
<h4>&#x26a1; Groq come Alternativa Budget</h4>
<p>Se il costo &egrave; la priorit&agrave; assoluta, Groq con Llama 3.3 70B &egrave; l'opzione pi&ugrave; economica con qualit&agrave; accettabile. La velocit&agrave; di inferenza (<strong>394&ndash;840 TPS</strong>) &egrave; imbattibile. Il limite &egrave; nella qualit&agrave; del tool calling rispetto ai modelli proprietari.</p>
</div>
</div>
</div>
</section>
<div class="divider"></div>
<!-- ═══════ FOOTER ═══════ -->
<footer>
<div class="wrap">
<p class="note">
Prezzi aggiornati ad Aprile 2026. I prezzi possono variare rapidamente &mdash; verificare sempre le pagine ufficiali dei provider prima di prendere decisioni.<br>
Questo report considera esclusivamente l'uso via API con policy di non-utilizzo dati per training dei modelli.
</p>
<p class="label mb-2">Fonti</p>
<div class="sources-grid">
<a href="https://openai.com/api/pricing/" target="_blank">OpenAI API Pricing</a>
<a href="https://platform.claude.com/docs/en/docs/about-claude/models" target="_blank">Anthropic Claude Models</a>
<a href="https://ai.google.dev/pricing" target="_blank">Google Gemini API Pricing</a>
<a href="https://mistral.ai/pricing" target="_blank">Mistral AI Pricing</a>
<a href="https://groq.com/pricing" target="_blank">Groq On-Demand Pricing</a>
<a href="https://www.cerebras.ai/policies" target="_blank">Cerebras Privacy Policy</a>
<a href="https://api-docs.deepseek.com/quick_start/pricing/" target="_blank">DeepSeek API Pricing</a>
<a href="https://docs.z.ai/guides/overview/pricing" target="_blank">Zhipu GLM Pricing</a>
<a href="https://developers.openai.com/api/docs/guides/your-data" target="_blank">OpenAI Data Controls</a>
<a href="https://openai.com/enterprise-privacy/" target="_blank">OpenAI Enterprise Privacy</a>
<a href="https://legal.mistral.ai/terms/privacy-policy" target="_blank">Mistral Privacy Policy</a>
<a href="https://support.google.com/gemini/answer/13594961" target="_blank">Gemini Privacy Hub</a>
<a href="https://pricepertoken.com/" target="_blank">Price Per Token &mdash; LLM Pricing 2026</a>
<a href="https://costgoat.com/compare/llm-api" target="_blank">CostGoat LLM Comparison</a>
<a href="https://llm-stats.com/leaderboards/best-ai-for-tool-calling" target="_blank">Best AI for Tool Calling 2026</a>
<a href="https://aicostboard.com/blog/posts/llm-api-pricing-comparison-2026" target="_blank">AI Cost Board Pricing Comparison</a>
</div>
<p style="margin-top:40px; font-size:0.75rem; color:var(--ink-3); text-align:center;">
Report generato per adiuvAI &bull; Aprile 2026
</p>
</div>
</footer>
<script>
// ── Reveal on scroll ─────────────────────────────
const reveals = document.querySelectorAll('.reveal');
const observer = new IntersectionObserver((entries) => {
entries.forEach((e, i) => {
if (e.isIntersecting) {
setTimeout(() => e.target.classList.add('visible'), i * 60);
observer.unobserve(e.target);
}
});
}, { threshold: 0.08 });
reveals.forEach(el => observer.observe(el));
// ── Tabs ──────────────────────────────────────────
document.querySelectorAll('.tab-btn').forEach(btn => {
btn.addEventListener('click', () => {
document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
document.querySelectorAll('.tab-panel').forEach(p => p.classList.remove('active'));
btn.classList.add('active');
document.getElementById('tab-' + btn.dataset.tab).classList.add('active');
});
});
// ── TOC active state ──────────────────────────────
const sections = document.querySelectorAll('section, header');
const tocLinks = document.querySelectorAll('.toc a');
const tocObserver = new IntersectionObserver((entries) => {
entries.forEach(e => {
if (e.isIntersecting) {
tocLinks.forEach(l => l.classList.remove('active'));
const link = document.querySelector(`.toc a[href="#${e.target.id}"]`);
if (link) link.classList.add('active');
}
});
}, { threshold: 0.3 });
sections.forEach(s => { if (s.id) tocObserver.observe(s); });
// ── Cost Chart ────────────────────────────────────
// Usage: 500 home (2K in + 1K out), 300 floating (500 in + 300 out),
// 210 brief (1.5K in + 500 out), 100 background agent runs (3K in + 2K out),
// 10 setup turns (2 sessioni × 5 turni, 4K in + 500 out), 1000 embeds (500 in)
const usage = {
home: { msgs: 500, inTok: 2000, outTok: 1000 },
float: { msgs: 300, inTok: 500, outTok: 300 },
brief: { msgs: 210, inTok: 1500, outTok: 500 },
batch: { msgs: 100, inTok: 3000, outTok: 2000 },
setup: { msgs: 10, inTok: 4000, outTok: 500 },
embed: { msgs: 1000, inTok: 500 }
};
function calcCost(feature, inPrice, outPrice) {
const u = usage[feature];
const inCost = (u.msgs * u.inTok / 1e6) * inPrice;
const outCost = u.outTok ? (u.msgs * u.outTok / 1e6) * outPrice : 0;
return inCost + outCost;
}
// Nota: il Batch API LLM non è compatibile con gli agenti di processing (loop
// tool-calling sincrono). I prezzi degli agenti usano l'API Standard, non batch.
// Setup agent usa un modello di qualità superiore (interattivo, basso volume).
const strategies = [
{
name: 'Multi-Provider',
color: 'green',
// agents: GPT-4.1 Mini ($0.40/$1.60) | setup: GPT-4.1 ($2.00/$8.00)
cost: calcCost('home', 0.30, 2.50) + calcCost('float', 0.10, 0.40) + calcCost('brief', 0.10, 0.40) + calcCost('batch', 0.40, 1.60) + calcCost('setup', 2.00, 8.00) + (1000 * 500 / 1e6) * 0.02
},
{
name: 'Groq Budget',
color: 'blue',
// agents: Qwen3 32B ($0.29/$0.59) | setup: GPT-4.1 Mini ($0.40/$1.60, esterno)
cost: calcCost('home', 0.59, 0.79) + calcCost('float', 0.11, 0.34) + calcCost('brief', 0.05, 0.08) + calcCost('batch', 0.29, 0.59) + calcCost('setup', 0.40, 1.60) + (1000 * 500 / 1e6) * 0.02
},
{
name: 'OpenAI Enterprise',
color: 'amber',
// agents: GPT-4.1 Mini ($0.40/$1.60) | setup: GPT-4.1 ($2.00/$8.00)
cost: calcCost('home', 2.00, 8.00) + calcCost('float', 0.40, 1.60) + calcCost('brief', 0.10, 0.40) + calcCost('batch', 0.40, 1.60) + calcCost('setup', 2.00, 8.00) + (1000 * 500 / 1e6) * 0.02
},
{
name: 'Anthropic Full',
color: 'purple',
// agents: Claude Sonnet 4.6 ($3.00/$15.00) | setup: Claude Sonnet 4.6
cost: calcCost('home', 3.00, 15.00) + calcCost('float', 1.00, 5.00) + calcCost('brief', 1.00, 5.00) + calcCost('batch', 3.00, 15.00) + calcCost('setup', 3.00, 15.00) + (1000 * 500 / 1e6) * 0.02
},
{
name: 'Mistral EU',
color: 'teal',
// agents: Mistral Large 3 ($2.00/$6.00) | setup: Mistral Large 3
cost: calcCost('home', 1.00, 3.00) + calcCost('float', 0.20, 0.60) + calcCost('brief', 0.20, 0.60) + calcCost('batch', 2.00, 6.00) + calcCost('setup', 2.00, 6.00) + (1000 * 500 / 1e6) * 0.02
},
{
name: 'Google Full',
color: 'pink',
// agents: Gemini 2.5 Flash ($0.30/$2.50) | setup: Gemini 2.5 Flash
cost: calcCost('home', 0.30, 2.50) + calcCost('float', 0.10, 0.40) + calcCost('brief', 0.10, 0.40) + calcCost('batch', 0.30, 2.50) + calcCost('setup', 0.30, 2.50) + (1000 * 500 / 1e6) * 0.15
}
];
const maxCost = Math.max(...strategies.map(s => s.cost));
const minCost = Math.min(...strategies.map(s => s.cost));
const chart = document.getElementById('costChart');
strategies.sort((a, b) => a.cost - b.cost);
strategies.forEach((s, i) => {
const pct = (s.cost / maxCost) * 100;
const isBest = s.cost === minCost;
const row = document.createElement('div');
row.className = 'cost-row';
row.innerHTML = `
<span class="provider-name">${s.name}</span>
<div class="cost-bar-track">
<div class="cost-bar-fill ${s.color}" style="width: 0%;" data-width="${pct}"></div>
</div>
<span class="cost-amount ${isBest ? 'best' : ''}">$${s.cost.toFixed(2)}</span>
`;
chart.appendChild(row);
});
// Animate bars
setTimeout(() => {
document.querySelectorAll('.cost-bar-fill').forEach(bar => {
bar.style.width = bar.dataset.width + '%';
});
}, 600);
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink