Sering nggak sih, nemu artikel panjang, terus harus di-block, copy, buka tab ChatGPT, paste, baru tanya? 😩 Ribet dan ngerusak flow kerja banget.
Sawyer Hood, seorang developer kreatif, baru aja sharing gimana dia memecahkan masalah ini dengan bikin LLM Extension sendiri. Simpel, tapi game changer.
Ini bedahannya:
1. ⚠️ Problem Statement (Masalah)
* Friction (Hambatan): AI chat (seperti ChatGPT/Claude) biasanya hidup di tab terpisah. Kita harus bawa data (teks) ke AI, bukan AI yang datang ke data.
* Context Switching: Pindah-pindah tab bikin otak capek dan gampang terdistraksi.
* Privasi: Banyak ekstensi AI yang ada di pasar itu closed-source, berbayar, atau kita nggak tau data kita dikirim ke mana.
2. 🛠️ Metodologi & Solusi
Sawyer membangun ekstensi Chrome sederhana yang menghubungkan browser dengan LLM (bisa OpenAI API atau Local LLM via Ollama).
* DOM Reader: Ekstensi ini membaca teks di halaman web yang sedang dibuka (menggunakan library Readability untuk membuang iklan/menu sampah).
* Context Injection: Teks bersih tadi otomatis dimasukkan ke dalam system prompt sebagai konteks.
* Chat Interface: Muncul sidebar di sebelah kanan website, jadi kamu bisa langsung "ngobrol" dengan artikel/dokumen tersebut.
3. 📈 Findings & Hasil
* ⚡ Seamless Workflow: Mau rangkum artikel? Mau tanya "Bagian mana yang bahas harga?" Tinggal ketik. Nggak perlu copy-paste lagi.
* 🧠 Better Context: Karena AI membaca struktur HTML yang sudah dibersihkan, pemahamannya seringkali lebih baik daripada sekadar raw text copy paste.
* 🔓 Freedom: Karena open source, kita bisa ganti modelnya sesuka hati. Mau pinter? Pakai GPT-4o. Mau gratis & privat? Pakai Llama 3 lokal.
4. 💡 Key Takeaways
* Bring AI to the Data: Masa depan UX AI bukanlah "Chatbot" terpisah, tapi lapisan (layer) pintar di atas aplikasi yang sudah kita pakai sehari-hari.
* DIY is Powerful: Membangun wrapper AI sederhana ternyata nggak susah, dan bisa disesuaikan 100% dengan kebutuhan pribadi kita.
* Local First: Tren menjalankan AI di laptop sendiri (Local LLM) makin relevan untuk privasi dan kecepatan.
💻 How to Build / Use (Konsep Dasar)
Kalau kamu developer web, kamu bisa bikin ini dalam weekend:
* Manifest V3: Buat ekstensi Chrome standar.
* Content Script: Gunakan @mozilla/readability untuk scrape konten artikel di tab aktif.
* Side Panel API: Gunakan fitur baru Chrome sidePanel untuk menampilkan UI chat.
* Connect LLM: Kirim konten + pertanyaan user ke API OpenAI atau endpoint Ollama (http://localhost:11434).
🔗 Baca Blog & Lihat Kodenya:
https://www.sawyerhood.com/blog/llm-extension
#WebDevelopment #ArtificialIntelligence #ChromeExtension #OpenSource #LLM #Ollama #ProductivityHacks #Coding #SawyerHood
