Dipublikasikan: 28 April 2025, Terakhir diperbarui: 21 Mei 2025
Evolusi AI yang pesat membuka peluang baru bagi aplikasi web, terutama dengan munculnya kemampuan di perangkat. Cari tahu bagaimana CyberAgent, perusahaan internet terkemuka di Jepang, menggunakan AI bawaan Chrome dan Prompt API untuk meningkatkan pengalaman blogging di platform mereka, Ameba Blog.
Kami membagikan sasaran mereka, manfaat bekerja dengan AI bawaan, tantangan yang mereka hadapi, dan insight berharga bagi developer lain yang menggunakan AI bawaan.
Apa itu Prompt API?
Penjelasan | Web | Ekstensi | Status Chrome | Intent |
---|---|---|---|---|
GitHub | View | Niat untuk Bereksperimen |
Prompt API membantu developer menggunakan model bahasa yang besar untuk menambahkan fitur AI langsung ke dalam aplikasi mereka. Dengan menentukan perintah kustom, aplikasi dapat melakukan tugas seperti ekstraksi data, pembuatan konten, dan respons yang dipersonalisasi. Di Chrome, Prompt API melakukan inferensi sisi klien dengan Gemini Nano. Pemrosesan lokal ini, terlepas dari model yang digunakan, meningkatkan privasi data dan kecepatan respons. Model apa pun yang digunakan, kecepatan respons klien.
Bantuan AI untuk penulis Blog Ameba
CyberAgent menyadari masalah umum yang dialami penulis: proses pembuatan konten yang menarik, terutama judul, yang sering kali memakan waktu. Mereka berhipotesis bahwa mengintegrasikan fungsi yang didukung AI dalam antarmuka pembuatan blog dapat meningkatkan kualitas dan efisiensi pembuatan konten secara signifikan. Tujuannya adalah menyediakan alat yang memberikan inspirasi dan membantu blogger mereka membuat konten yang menarik.
CyberAgent mengembangkan Ekstensi Chrome dengan Prompt API. Ekstensi ini menyediakan serangkaian fitur berteknologi AI yang dirancang untuk membantu penulis Ameba Blog membuat judul dan heading, paragraf berikutnya, serta peningkatan kualitas teks secara umum.
CyberAgent menginginkan fleksibilitas kemampuan, yang langsung mengarah ke Prompt API. Dengan kemungkinan tak terbatas dalam satu API, CyberAgent dapat menentukan secara tepat apa yang akan berfungsi paling baik dan paling berguna bagi penulis Ameba.
CyberAgent menguji ekstensi ini dengan sejumlah blogger tertentu, yang memberikan insight berharga tentang kepraktisan fungsi yang ditawarkan. Masukan tersebut membantu CyberAgent mengidentifikasi aplikasi yang lebih baik untuk bantuan AI dan menyempurnakan desain ekstensi. Berdasarkan hasil dan masukan positif, CyberAgent berencana merilis fitur ini pada masa mendatang, sehingga menghadirkan kecanggihan AI sisi klien langsung ke komunitas blogging mereka.
Mari kita pelajari lebih lanjut fitur-fitur ini.
Menulis judul dan heading yang lebih baik
Ekstensi ini membuat beberapa saran judul, berdasarkan konten blog lengkap. Penulis blog dapat lebih menyempurnakan saran ini, dengan opsi yang mencakup: "Buat Ulang", "Lebih Sopan", "Lebih Santai", atau "Buat Judul Serupa", dan lainnya.
CyberAgent mendesain UI secara khusus agar pengguna tidak perlu menulis perintah apa pun. Dengan begitu, pengguna yang tidak terbiasa dengan rekayasa perintah juga dapat memanfaatkan kecanggihan AI.
Ekstensi ini juga dapat membuat header yang menarik untuk setiap bagian blog, yang dapat diminta penulis dengan memilih teks yang relevan untuk judul.
Kode untuk membuat judul dengan Prompt API mencakup perintah awal dan perintah pengguna. Perintah awal memberikan konteks dan petunjuk untuk mendapatkan jenis output tertentu, sedangkan perintah pengguna meminta model untuk berinteraksi dengan apa yang ditulis pengguna. Baca selengkapnya tentang kode mereka di Men-deploy bantuan AI.
Membuat paragraf berikutnya
Ekstensi ini membantu blogger mengatasi kebuntuan ide dengan membuat paragraf berikutnya berdasarkan teks yang dipilih. Dengan konteks dari paragraf sebelumnya, AI membuat draf kelanjutan paragraf, sehingga penulis dapat mempertahankan alur kreatif mereka.
Memperbaiki dan mengedit teks
Gemini Nano menganalisis teks yang dipilih dan dapat menyarankan peningkatan. Pengguna dapat membuat ulang peningkatan dengan catatan tambahan tentang pilihan bahasa dan gaya penulisan untuk membuat salinan "lebih menarik" atau "lebih sederhana".
Men-deploy bantuan AI
CyberAgent memecah kode ekstensi mereka menjadi tiga langkah: pembuatan sesi, pemicu, dan perintah model.
Pertama, mereka memeriksa dengan browser apakah AI bawaan tersedia dan didukung. Jika ya, mereka akan membuat sesi dengan parameter default.
if (!LanguageModel) {
// Detect the feature and display "Not Supported" message as needed
return;
}
// Define default values for topK and temperature within the application
const DEFAULT_TOP_K = 3;
const DEFAULT_TEMPERATURE = 1;
let session = null;
async function createAISession({ initialPrompts, topK, temperature } = {}) {
const { available, defaultTopK, maxTopK, defaultTemperature } =
await LanguageModel.availability();
// "readily", "after-download", or "no"
if (available === "no") {
return Promise.reject(new Error('AI not available'));
}
const params = {
monitor(monitor) {
monitor.addEventListener('downloadprogress', event => {
console.log(`Downloaded: ${event.loaded} of ${event.total} bytes.`);
});
},
initialPrompts: initialPrompts || '',
topK: topK || defaultTopK,
temperature: temperature || defaultTemperature,
};
session = await LanguageModel.create(params);
return session;
}
Setiap fitur memiliki fungsi bantuan yang dipicu oleh pengguna. Setelah dipicu, saat pengguna mengklik tombol yang relevan, sesi akan diperbarui.
async function updateSession({ initialPrompts, topK, temperature } = {
topK: DEFAULT_TOP_K,
temperature: DEFAULT_TEMPERATURE,
}) {
if (session) {
session.destroy();
session = null;
}
session = await createAISession({
initialPrompts,
topK,
temperature,
});
}
Setelah sesi diperbarui, mereka akan meminta model sesuai dengan fungsi. Misalnya, berikut kode untuk membuat judul dan membuat ulang judul dengan gaya bahasa yang lebih formal.
async function generateTitle() {
// Initialize the model session
await updateSession({
initialPrompts: [
{ role: 'system',
content: `Create 3 titles suitable for the blog post's content,
within 128 characters, and respond in JSON array format.`,
}
]
});
const prompt = `Create a title for the following
blog post.${textareaEl.textContent}`;
const result = await session.prompt(prompt);
try {
const fixedJson = fixJSON(result);
// display result
displayResult(fixedJSON);
} catch (error) {
// display error
displayError();
}
}
async function generateMoreFormalTitle() {
// Do not execute updateSession to reuse the session during regeneration
const prompt = 'Create a more formal title.';
const result = await session.prompt(prompt);
...
}
Manfaat AI bawaan
AI bawaan adalah jenis AI sisi klien, yang berarti inferensi terjadi di perangkat pengguna. CyberAgent memilih untuk menggunakan API AI bawaan dengan Gemini Nano karena keunggulan menarik yang ditawarkannya bagi developer dan pengguna aplikasi.
Manfaat utama yang menjadi fokus CyberAgent meliputi:
- Keamanan dan privasi
- Biaya
- Responsivitas dan keandalan
- Kemudahan pengembangan
Keamanan dan privasi
Kemampuan untuk menjalankan model AI langsung di perangkat pengguna tanpa mengirimkan data ke server eksternal sangatlah penting. Draf blog tidak dimaksudkan untuk dilihat oleh publik, sehingga CyberAgent tidak ingin mengirimkan draf ini ke server pihak ketiga.
AI bawaan mendownload Gemini Nano ke perangkat pengguna, sehingga tidak perlu mengirim dan menerima data dari server. Fitur ini sangat berguna saat menulis, karena draf dapat mencakup informasi rahasia atau ekspresi yang tidak diinginkan. AI bawaan menyimpan konten asli dan konten yang dihasilkan secara lokal, bukan mengirimkannya ke server, sehingga dapat meningkatkan keamanan dan melindungi privasi konten.
Penghematan biaya
Salah satu keuntungan utama menggunakan AI bawaan adalah browser menyertakan Gemini Nano dan API-nya gratis untuk digunakan. Tidak ada biaya tambahan atau tersembunyi.
AI bawaan mengurangi biaya server secara signifikan dan dapat sepenuhnya menghilangkan biaya yang terkait dengan inferensi AI. Solusi ini dapat diskalakan dengan cepat ke basis pengguna yang besar, dan memungkinkan pengguna mengirimkan perintah berurutan untuk menyempurnakan output tanpa menimbulkan biaya tambahan.
Responsivitas dan keandalan
AI bawaan memberikan waktu respons yang konsisten dan cepat, terlepas dari kondisi jaringan. Hal ini memungkinkan pengguna membuat konten berulang kali, sehingga pengguna dapat mencoba ide baru dan membuat hasil akhir yang memuaskan dengan lebih mudah dan cepat.
Kemudahan pengembangan
AI bawaan Chrome menyederhanakan proses pengembangan dengan menyediakan API yang siap digunakan. Developer diuntungkan oleh kemudahan dalam membuat fitur berteknologi AI untuk aplikasi mereka.
Gemini Nano dan API AI bawaan diinstal di Chrome, sehingga tidak memerlukan penyiapan atau pengelolaan model tambahan. API ini menggunakan JavaScript, seperti API browser lainnya, dan tidak memerlukan keahlian dalam machine learning.
Mengatasi tantangan untuk mendapatkan hasil yang lebih baik
Perjalanan CyberAgent dengan Prompt API memberikan pelajaran berharga tentang nuansa bekerja dengan LLM sisi klien.
- Respons yang tidak konsisten: Seperti LLM lainnya, Gemini Nano tidak menjamin output yang identik untuk perintah yang sama. CyberAgent menemukan respons dalam format yang tidak terduga (seperti Markdown dan JSON yang tidak valid). Meskipun ada petunjuk, hasil yang didapatkan mungkin sangat bervariasi. Saat menerapkan aplikasi atau Ekstensi Chrome dengan AI bawaan, sebaiknya tambahkan solusi untuk memastikan output selalu dalam format yang benar.
- Batas token: Mengelola penggunaan token sangat penting. CyberAgent menggunakan properti dan metode seperti
inputUsage
,inputQuota
, danmeasureInputUsage()
untuk mengelola sesi, mempertahankan konteks, dan mengurangi konsumsi token. Hal ini sangat penting terutama saat menyempurnakan judul. - Batasan ukuran model: Karena model didownload dan berada di perangkat pengguna, model ini jauh lebih kecil daripada model berbasis server. Artinya, Anda harus memberikan konteks yang memadai dalam perintah untuk mendapatkan hasil yang memuaskan, terutama untuk peringkasan. Pelajari lebih lanjut cara memahami ukuran LLM.
CyberAgent menekankan bahwa meskipun model sisi klien belum tersedia secara universal di semua browser dan perangkat, dan model yang lebih kecil memiliki batasan, model ini tetap dapat memberikan performa yang mengesankan untuk tugas tertentu. Kemampuan untuk melakukan iterasi dengan cepat dan bereksperimen tanpa biaya sisi server menjadikannya alat yang berharga.
Mereka menyarankan untuk menemukan keseimbangan, dengan menyadari bahwa respons yang sempurna sulit dicapai dengan AI apa pun, baik sisi server maupun sisi klien. Terakhir, mereka melihat masa depan di mana pendekatan hybrid, yang menggabungkan kekuatan AI sisi server dan sisi klien, akan membuka potensi yang lebih besar.
Rencana ke depan
Eksplorasi AI bawaan CyberAgent menunjukkan berbagai kemungkinan menarik dari integrasi AI yang lancar untuk meningkatkan pengalaman pengguna. Ekstensi yang dibuat untuk bekerja dengan Ameba Blog menunjukkan bagaimana teknologi ini dapat diterapkan secara praktis untuk memecahkan masalah di dunia nyata, sehingga memberikan pelajaran berharga bagi komunitas pengembangan web yang lebih luas.
Seiring dengan matangnya teknologi dan meluasnya dukungan untuk browser dan perangkat, kami berharap dapat melihat lebih banyak aplikasi inovatif dari AI bawaan dan bentuk AI sisi klien lainnya.
Resource
- Pelajari Prompt API lebih lanjut
- Mulai menggunakan API Bawaan di Chrome
- Studi kasus CyberAgent tentang Web AI, yang membahas topik yang sama.
- Tonton Masa depan AI ada di sini, studi kasus CyberAgent tentang AI sisi klien
Ucapan terima kasih
Terima kasih kepada blogger Ameba, ao, Nodoka, Erin, Chiaki, dan socchi, yang telah memberikan masukan dan membantu meningkatkan kualitas ekstensi ini. Terima kasih kepada Thomas Steiner, Alexandra Klepper, dan Sebastian Benz atas bantuan mereka dalam menulis dan meninjau postingan blog ini.