Expert guide for automated and manual Web Accessibility (a11y) testing — axe-core, Pa11y, Playwright a11y, screen reader testing, and WCAG 2.2 Level AA/AAA compliance / Panduan ahli pengujian aksesibilitas web.
中文简介正在准备中。当前显示原文说明。
Expert guide for Ultra-Low Latency Conversational Voice AI (<300ms), WebRTC bidirectional streaming, OpenAI Realtime API, Gemini Multimodal Live Audio, LiveKit Agents, and Semantic VAD / Panduan ahli AI suara percakapan real-time berlatensi ultra-rendah.
中文简介正在准备中。当前显示原文说明。
查看安装方法安装前可以查看交给 AI 代理的指令内容。
<a name="english"></a>
ai-llm-integration-expert, gemini-agent-booster, frontier-ai-models-expertrealtime-collaboration-expert, sse-websocket-streaming-expertsenior-frontend, mobile-expo-expert, apple-ecosystem-expertmulti-agent-orchestration, parallel-tool-orchestrator, chatbot-messaging-expertzero-to-prod-orchestrator, session-memory-manager, anti-slopExpert guide for building ultra-low-latency (<300ms), bi-directional conversational voice AI applications. Covers WebRTC, full-duplex WebSocket audio streaming (PCM 24kHz), OpenAI Realtime API, Gemini Multimodal Live API, LiveKit Agents SDK, and smart interruption (barge-in) handling.
gpt-5-realtime-preview / gpt-4o-realtime-preview) or Gemini Multimodal Live API.Traditional voice pipelines chain STT ➔ LLM ➔ TTS with cumulative latency exceeding 1,200ms–2,500ms. Modern 2026 voice agents use native speech-to-speech or streamable full-duplex WebRTC pipelines achieving natural, human-like reaction times (~250–350ms).
User Mic ──► [WebRTC / WebSocket] ──► [VAD: Silero / WebRTC VAD]
│
▼
User Speaks <── [Audio Output] ◄── [Native Audio Stream / Cartesia] ◄── [OpenAI Realtime / Gemini Live]
│
└── User Interrupts (Barge-in) ──► Instant Buffer Flush & Cancel Audio Frame Emission
# agent.py - Production Voice Agent Worker with LiveKit & OpenAI Realtime
import asyncio
import os
from livekit import rtc
from livekit.agents import (
AutoSubscribe,
JobContext,
JobProcess,
WorkerOptions,
cli,
llm,
)
from livekit.agents.pipeline import VoicePipelineAgent
from livekit.plugins import deepgram, openai, silero
async def entrypoint(ctx: JobContext):
# Connect to room with audio only to minimize bandwidth & latency
await ctx.connect(auto_subscribe=AutoSubscribe.AUDIO_ONLY)
# Wait for the user participant to join
participant = await ctx.wait_for_participant()
# Define agent instructions and tools
initial_ctx = llm.ChatContext().append(
role="system",
text=(
"You are a helpful, concise voice assistant. "
"Respond naturally in 1-2 short sentences. Never output markdown, bullet points, or emojis."
)
)
# Realtime Voice Pipeline: Deepgram (STT) + OpenAI (LLM) + Cartesia/OpenAI (TTS)
# Or use native OpenAI Realtime Model: gpt-4o-realtime-preview
agent = VoicePipelineAgent(
vad=silero.VAD.load(
min_speech_duration=0.1,
min_silence_duration=0.3, # Snappy turn-taking
prefix_padding_duration=0.2,
),
stt=deepgram.STT(model="nova-2", language="id"), # Multi-language support
llm=openai.LLM(model="gpt-5-mini"),
tts=openai.TTS(voice="alloy"),
chat_ctx=initial_ctx,
allow_interruptions=True, # Barge-in capability
interrupt_speech_duration=0.3, # Immediate cutoff when user talks
)
agent.start(ctx.room, participant)
# Greet user immediately
await agent.say("Halo! Ada yang bisa saya bantu hari ini?", now=True)
if __name__ == "__main__":
cli.run_app(WorkerOptions(entrypoint_fnc=entrypoint))
// gemini-live-audio.ts - Bidirectional WebSocket PCM 24kHz
import WebSocket from 'ws';
interface GeminiAudioConfig {
apiKey: string;
model?: string;
systemInstruction?: string;
}
export class GeminiVoiceAgent {
private ws: WebSocket | null = null;
private isConnected = false;
constructor(private config: GeminiAudioConfig) {}
public async connect(): Promise<void> {
const url = `wss://generativelanguage.googleapis.com/ws/google.ai.generativelanguage.v1alpha.GenerativeService.BidiGenerateContent?key=${this.config.apiKey}`;
this.ws = new WebSocket(url);
this.ws.on('open', () => {
this.isConnected = true;
this.sendInitialHandshake();
});
this.ws.on('message', (data: WebSocket.Data) => {
this.handleIncomingAudio(data);
});
}
private sendInitialHandshake(): void {
const setupMessage = {
setup: {
// Availability Fallback Invariant: Gemini 4 Argon -> Gemini 3.8 Flash
model: `models/${this.config.model || (process.env.GEMINI_FALLBACK ? 'gemini-3.8-flash' : 'gemini-4-argon')}`,
generationConfig: {
responseModalities: ["AUDIO"],
speechConfig: {
voiceConfig: {
prebuiltVoiceConfig: { voiceName: "Puck" }
}
}
},
systemInstruction: {
parts: [{ text: this.config.systemInstruction || "You are a conversational voice agent. Keep answers brief." }]
}
}
};
this.ws?.send(JSON.stringify(setupMessage));
}
// Stream raw PCM 16-bit 24kHz mono audio from mic
public sendAudioChunk(pcm16Chunk: Buffer): void {
if (!this.isConnected || !this.ws) return;
const base64Audio = pcm16Chunk.toString('base64');
const msg = {
realtimeInput: {
mediaChunks: [
{
mimeType: "audio/pcm;rate=24000",
data: base64Audio
}
]
}
};
this.ws.send(JSON.stringify(msg));
}
private handleIncomingAudio(data: WebSocket.Data): void {
try {
const response = JSON.parse(data.toString());
const parts = response.serverContent?.modelTurn?.parts;
if (parts) {
for (const part of parts) {
if (part.inlineData?.data) {
const pcmBuffer = Buffer.from(part.inlineData.data, 'base64');
this.playAudioSpeaker(pcmBuffer);
}
}
}
} catch {
// Binary PCM frame handler
}
}
private playAudioSpeaker(pcmChunk: Buffer): void {
// Send to WebRTC audio track or audio output device
}
}
300ms and 450ms. Lower thresholds cause the bot to interrupt users when they pause to think; higher thresholds make the conversation feel robotic.<a name="bahasa-indonesia"></a>
ai-llm-integration-expert, gemini-agent-booster, frontier-ai-models-expertrealtime-collaboration-expert, sse-websocket-streaming-expertsenior-frontend, mobile-expo-expert, apple-ecosystem-expertmulti-agent-orchestration, parallel-tool-orchestrator, chatbot-messaging-expertzero-to-prod-orchestrator, session-memory-manager, anti-slopPanduan ahli untuk membangun aplikasi AI suara percakapan berlatensi ultra-rendah (<300ms) dan dua arah (bi-directional). Mencakup WebRTC, streaming audio WebSocket full-duplex (PCM 16-bit 24kHz), OpenAI Realtime API, Gemini Multimodal Live API, LiveKit Agents SDK, dan penanganan interupsi percakapan cerdas (smart barge-in).
# agen_suara.py - Worker Agen Suara LiveKit Produksi
import asyncio
from livekit import rtc
from livekit.agents import AutoSubscribe, JobContext, WorkerOptions, cli, llm
from livekit.agents.pipeline import VoicePipelineAgent
from livekit.plugins import deepgram, openai, silero
async def entrypoint(ctx: JobContext):
# Sambungkan ke room hanya dengan audio untuk meminimalkan bandwidth & latensi
await ctx.connect(auto_subscribe=AutoSubscribe.AUDIO_ONLY)
peserta = await ctx.wait_for_participant()
konteks_awal = llm.ChatContext().append(
role="system",
text=(
"Anda adalah asisten suara yang ramah dan ringkas. "
"Jawablah dengan 1-2 kalimat pendek secara natural. Jangan pernah mengeluarkan format markdown atau emoji."
)
)
agen = VoicePipelineAgent(
vad=silero.VAD.load(
min_speech_duration=0.1,
min_silence_duration=0.3, # Pengambilan giliran bicara yang responsif
prefix_padding_duration=0.2,
),
stt=deepgram.STT(model="nova-2", language="id"),
llm=openai.LLM(model="gpt-5-mini"),
tts=openai.TTS(voice="alloy"),
chat_ctx=konteks_awal,
allow_interruptions=True, # Memungkinkan interupsi pengguna (barge-in)
interrupt_speech_duration=0.3,
)
agen.start(ctx.room, peserta)
await agen.say("Halo! Ada yang bisa saya bantu hari ini?", now=True)
if __name__ == "__main__":
cli.run_app(WorkerOptions(entrypoint_fnc=entrypoint))
// gemini-suara-agent.ts
import WebSocket from 'ws';
export class AgenSuaraGemini {
private ws: WebSocket | null = null;
private terhubung = false;
constructor(private apiKey: string) {}
public async hubungkan(): Promise<void> {
const url = `wss://generativelanguage.googleapis.com/ws/google.ai.generativelanguage.v1alpha.GenerativeService.BidiGenerateContent?key=${this.apiKey}`;
this.ws = new WebSocket(url);
this.ws.on('open', () => {
this.terhubung = true;
this.kirimHandshakeAwal();
});
}
private kirimHandshakeAwal(): void {
const konfigurasi = {
setup: {
// Invarian Pengalihan Ketersediaan: Gemini 4 Argon -> Gemini 3.8 Flash
model: `models/${process.env.GEMINI_FALLBACK ? 'gemini-3.8-flash' : 'gemini-4-argon'}`,
generationConfig: {
responseModalities: ['AUDIO'],
speechConfig: {
voiceConfig: { prebuiltVoiceConfig: { voiceName: 'Puck' } }
}
},
systemInstruction: {
parts: [{ text: 'Anda adalah asisten suara cerdas. Berikan jawaban yang singkat dan padat.' }]
}
}
};
this.ws?.send(JSON.stringify(konfigurasi));
}
// Alirkan potongan audio mentah PCM 16-bit 24kHz dari mikrofon
public alirkanAudio(chunkPcm: Buffer): void {
if (!this.terhubung || !this.ws) return;
const pesanAudio = {
realtimeInput: {
mediaChunks: [{ mimeType: 'audio/pcm;rate=24000', data: chunkPcm.toString('base64') }]
}
};
this.ws.send(JSON.stringify(pesanAudio));
}
}
还没有评价。欢迎分享你的使用感受。
无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
Expert guide for automated and manual Web Accessibility (a11y) testing — axe-core, Pa11y, Playwright a11y, screen reader testing, and WCAG 2.2 Level AA/AAA compliance / Panduan ahli pengujian aksesibilitas web.
中文简介正在准备中。当前显示原文说明。
Expert guide for intelligent model cascading and routing — complexity-scored task routing from Fast (Composer 2.5, Grok 4.7/4.6) to Medium (Gemini 4 Argon, GPT-5.6 Sol, Claude Opus 5.5) and High (Claude Sonnet 5.5, Claude Fable 5.1, Muse Wonder) / Panduan ahli untuk kaskade dan routing model cerdas.
中文简介正在准备中。当前显示原文说明。
Expert guide for intelligent model cascading and routing — complexity-scored task routing from Flash/Haiku to Sonnet/Opus/Astra, dynamic escalation with quality gates, 40-60% token cost reduction while maintaining output quality / Panduan ahli untuk kaskade dan routing model cerdas — routing tugas berbasis skor kompleksitas dari Flash/Haiku ke Sonnet/Opus/Astra, eskalasi dinamis dengan gerbang kualitas, pengurangan biaya token 40-60% dengan kualitas output terjaga.
中文简介正在准备中。当前显示原文说明。
Master guide for Affective Computing, emotional AI, and real-time sentiment analysis through native multimodal tokens (voice intonation and facial micro-expressions) / Panduan utama komputasi afektif, AI emosional, dan analisis sentimen real-time melalui token multimodal native.
中文简介正在准备中。当前显示原文说明。
Expert guide for Affective Computing, emotional AI, and real-time sentiment analysis through native multimodal tokens (voice intonation and facial micro-expressions) / Panduan ahli komputasi afektif, AI emosional, dan analisis sentimen real-time melalui token multimodal native.
中文简介正在准备中。当前显示原文说明。
Expert guide for AI-assisted coding workflows — agentic code generation, multi-agent code swarms, self-healing CI/CD, automated PR review, spec-to-code pipelines, codebase knowledge graphs, and human-in-the-loop approval gates / Panduan ahli untuk workflow pengkodean berbasis AI — generasi kode agentic, code swarm multi-agen, CI/CD self-healing, review PR otomatis, pipeline spec-to-code, knowledge graph codebase, dan gate persetujuan human-in-the-loop.
中文简介正在准备中。当前显示原文说明。