AI-powered website chatbot that automatically reads your entire site and answers visitor questions in real time — no backend required.

WebChat.js is a lightweight, production-ready embeddable AI chatbot widget for any website. It scrapes your site content, understands context, and delivers intelligent answers using top-tier AI providers — with a robust offline fallback.

Just drop in a single <script> tag. No server, no database, no complex setup. Built-in lazy loading ensures your main page load speed is never compromised.

Perfect for: Portfolios, agency sites, SaaS landing pages, e-commerce, documentation, and personal brands.

<script src="https://webchat-js.pages.dev/webchat.min.js"
  data-webchat
  data-deepseek-key="sk-XXXXXXXXXXXXXXXXXXXXXXXX"
  data-groq-key="gsk_XXXXXXXXXXXXXXXXXXXXXXXX"
  data-bot-name="Maya's Assistant"
  data-primary-color="#7c3aed"
  data-accent-color="#00e5cc"
  data-position="bottom-right"
  data-theme="auto"
  data-lazy-load="true"
  data-lazy-scrape="true"
  data-enable-popup="true">
</script>

<script src="https://webchat-js.pages.dev/webchat.min.js"></script>
<script>
  const chat = new WebChat({
    deepseekApiKey: 'sk-xxx',
    groqApiKey:     'gsk_xxx',
    glmApiKey:      'xxx',

    botName:        "Maya's Assistant",
    primaryColor:   "#7c3aed",
    accentColor:    "#00e5cc",
    position:       "bottom-right",
    theme:          "auto",
    
    // Performance & Lazy Loading
    lazyLoad:       true,
    lazyScrape:     true,
    initDelay:      2000,
    scrapeDelay:    500,

    enablePopup:    true,
    persistConversation: true
  });
</script>

WebChat tries providers in priority order and automatically falls back if one fails.

Pro tip: You only need one working key to start. Smart Local Fallback ensures the bot always responds.

• Zero-Impact Lazy Loading — Defers DOM building and scraping so your main page loads instantly
• Automatic Website Scraping — Reads current page + internal links
• Smart Offline Fallback — Answers questions using scraped content when APIs are unavailable
• Sentiment-Aware Responses — Detects urgency or frustration and adjusts tone
• Dynamic Suggestion Chips — Context-aware quick replies
• Beautiful Glassmorphism UI — Smooth animations and modern design
• Mobile-First & Responsive
• Conversation Export — Download chat as JSON
• In-chat Controls — Sound toggle, expand/minimize, search, clear
• Rate Limiting & Token Tracking

const chat = new WebChat({ /* options */ });

chat.open();
chat.close();
chat.toggle();
chat.send("Tell me about your services");
chat.clear();
chat.destroy();

console.log(chat.getHistory());
console.log(chat.getTokenUsage());
chat.setTheme('dark');

1. Lazy Initialization — Script loads with zero impact. Only the toggle button is rendered initially. The full UI and scraping are deferred until the user interacts or a short timeout passes.
2. Context Building — Scrapes headings, sections, FAQs, contact info, and navigation (triggered exactly when needed).
3. User Interaction — Message → Sentiment detection → Rate limit check.
4. AI Response — Tries DeepSeek → Groq → GLM-4 → Smart Local Fallback.
5. Delivery — Typewriter animation + refreshed suggestions.

• webchat.js — Full readable source
• webchat.min.js — Recommended production build (minified & optimized)

• API keys are client-side. For high-traffic sites, consider proxying requests through your backend.
• All output is sanitized to prevent XSS.
• Client-side rate limiting is included; pair with server-side protection if needed.
• Performance: Lazy loading is enabled by default (lazyLoad: true, lazyScrape: true) to guarantee zero impact on Core Web Vitals.

MIT License — Free for both personal and commercial use.

Niloy Kanti Paul
Software Engineer & AI Developer

• Portfolio: https://dev-nkp.github.io/
• GitHub: https://github.com/dev-nkp
• LinkedIn: linkedin.com/in/niloy-kanti-paul

Made with ❤️ for better web experiences
Star ⭐ this repo if you find it useful!