Fecha de publicación: 28 de abril de 2025; Última actualización: 21 de mayo de 2025
La rápida evolución de la IA está abriendo nuevas fronteras para las aplicaciones web, especialmente con el surgimiento de las capacidades integradas en el dispositivo. Descubre cómo CyberAgent, una empresa líder de Internet de Japón, usa la IA integrada de Chrome y la API de Prompt para mejorar la experiencia de los blogs en su plataforma, Ameba Blog.
Compartimos sus objetivos, los beneficios de trabajar con IA integrada, los desafíos que enfrentaron y estadísticas valiosas para otros desarrolladores que usan IA integrada.
¿Qué es la API de Prompt?
| Explicación | Web | Extensiones | Estado de Chrome | Intent |
|---|---|---|---|---|
| GitHub |  En EPP |
 Versión beta de Chrome 137 |
Ver | Intent to Experiment |
La API de Prompt ayuda a los desarrolladores a usar una gran cantidad de modelos de lenguaje para agregar funciones de IA directamente a sus apps. Cuando se definen instrucciones personalizadas, las apps pueden realizar tareas como la extracción de datos, la generación de contenido y las respuestas personalizadas. En Chrome, la API de Prompt realiza inferencia del cliente con Gemini Nano. Este procesamiento local, independientemente del modelo que se use, mejora la privacidad de los datos y la velocidad de respuesta. Independientemente del modelo que se use, la velocidad de respuesta del cliente
Asistencia de IA para autores de Ameba Blog
CyberAgent reconoció un problema común para los autores: el proceso, a menudo lento, de crear contenido atractivo, en especial los títulos. Hicieron la hipótesis de que integrar funciones potenciadas por IA en la interfaz de creación de blogs podría mejorar significativamente la calidad y la eficiencia de la creación de contenido. Su objetivo era proporcionar herramientas que inspiren y ayuden a sus blogueros a crear contenido atractivo.
CyberAgent desarrolló una extensión de Chrome con la API de Prompt. Esta extensión proporciona un paquete de funciones potenciadas por IA diseñadas para ayudar a los escritores de Ameba Blog a generar títulos y encabezados, párrafos posteriores y mejoras generales en el texto.
CyberAgent quería flexibilidad en las funciones, lo que lo llevó directamente a la API de Prompt. Con infinitas posibilidades en una API, CyberAgent pudo determinar exactamente qué funcionaría mejor y sería más útil para los autores de Ameba.
CyberAgent probó la extensión con una cantidad seleccionada de blogueros, que ofrecieron estadísticas valiosas sobre la practicidad de las funciones ofrecidas. Los comentarios ayudaron a CyberAgent a identificar mejores aplicaciones para la asistencia de IA y definir mejor el diseño de la extensión. En función de los resultados y los comentarios positivos, CyberAgent planea lanzar esta función en el futuro, lo que llevará el poder de la IA del cliente directamente a su comunidad de blogueros.
Veamos estas funciones con más detalle.
Escribe mejores títulos y encabezados
La extensión genera varias sugerencias de títulos, según el contenido completo del blog. Los escritores de blogs pueden definir mejor estas sugerencias con opciones que incluyen "Regenerar", "Más educado", "Más informal", "Generar títulos similares" y mucho más.
CyberAgent diseñó la IU específicamente para que los usuarios no tengan que escribir ningún mensaje. De esta manera, cualquier usuario que no esté familiarizado con la ingeniería de instrucciones también puede beneficiarse del poder de la IA.
La extensión también puede generar encabezados atractivos para secciones individuales del blog, que los autores pueden solicitar seleccionando el texto relevante para un encabezado.
El código para generar un título con la API de Prompt incluye una instrucción inicial y una instrucción del usuario. La instrucción inicial proporciona contexto y las instrucciones para obtener un tipo de resultado particular, mientras que las instrucciones del usuario le piden al modelo que interactúe con lo que escribe el usuario. Obtén más información sobre su código en Cómo implementar la asistencia de IA.
Genera párrafos posteriores
La extensión ayuda a los bloggers a superar el bloqueo del escritor generando párrafos posteriores según el texto seleccionado. Con el contexto del párrafo anterior, la IA redacta una continuación del párrafo, lo que permite a los autores mantener su flujo creativo.
Mejora y edita el texto
Gemini Nano analiza el texto seleccionado y puede sugerir mejoras. Los usuarios pueden volver a generar las mejoras con notas adicionales sobre el tono y la elección del idioma para que el texto sea "más atractivo" o "más simple".
Implementa la asistencia de IA
CyberAgent dividió su código de extensión en tres pasos: creación de la sesión, activador y solicitud del modelo.
Primero, verifican con el navegador que la IA integrada esté disponible y sea compatible. Si es así, crean una sesión con parámetros predeterminados.
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;
}
Cada componente tiene una función de ayuda que activa el usuario. Una vez activado, cuando el usuario hace clic en el botón relevante, actualiza la sesión según corresponda.
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,
});
}
Después de actualizar la sesión, le solicitan al modelo según la función. Por ejemplo, este es el código para generar un título y volver a generarlo con un tono más 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);
...
}
Los beneficios de la IA integrada
La IA integrada es un tipo de IA del cliente, lo que significa que la inferencia se produce en el dispositivo del usuario. CyberAgent eligió usar APIs de IA integradas con Gemini Nano debido a las ventajas convincentes que ofrece a los desarrolladores y usuarios de aplicaciones.
Entre los beneficios clave en los que se enfocó CyberAgent, se incluyen los siguientes:
- Seguridad y privacidad
- Costo
- Capacidad de respuesta y confiabilidad
- Facilidad de desarrollo
Seguridad y privacidad
La capacidad de ejecutar modelos de IA directamente en el dispositivo del usuario sin transmitir datos a servidores externos es fundamental. Los borradores de los blogs no están destinados a que los vea el público, por lo que CyberAgent no quiere enviarlos a un servidor de terceros.
La IA integrada descarga Gemini Nano en los dispositivos del usuario, lo que elimina la necesidad de enviar y recibir datos de los servidores. Esto es muy útil cuando escribes, ya que los borradores pueden incluir información confidencial o expresiones no deseadas. La IA integrada mantiene el contenido original y generado de forma local en lugar de enviarlo a un servidor, lo que puede mejorar la seguridad y proteger la privacidad del contenido.
Ahorro de costos
Una de las principales ventajas de usar la IA integrada es que el navegador incluye Gemini Nano y las APIs son de uso gratuito. No hay costos adicionales ni ocultos.
La IA integrada reduce significativamente los costos del servidor y puede eliminar por completo los costos asociados con la inferencia de IA. Esta solución se puede escalar rápidamente a una gran base de usuarios y permite que los usuarios envíen instrucciones consecutivas para definir mejor los resultados sin incurrir en tarifas adicionales.
Capacidad de respuesta y confiabilidad
La IA integrada proporciona tiempos de respuesta coherentes y rápidos, independientemente de las condiciones de la red. Esto permitió a los usuarios generar contenido una y otra vez, lo que facilita mucho que prueben ideas nuevas y creen un resultado final satisfactorio con rapidez.
Facilidad de desarrollo
La IA integrada de Chrome simplifica el proceso de desarrollo, ya que proporciona una API disponible de inmediato. Los desarrolladores se benefician de la facilidad con la que se pueden crear funciones potenciadas por IA para sus aplicaciones.
Gemini Nano y las APIs de IA integradas se instalan en Chrome, por lo que no es necesario realizar ninguna configuración ni administración de modelos adicionales. Las APIs usan JavaScript, como otras APIs de navegador, y no requieren experiencia en aprendizaje automático.
Cómo navegar por los desafíos para obtener mejores resultados
El recorrido de CyberAgent con la API de Prompt proporcionó lecciones valiosas sobre las sutilezas de trabajar con LLM del cliente.
- Respuestas incoherentes: Al igual que otros LLM, Gemini Nano no garantiza resultados idénticos para la misma instrucción. CyberAgent encontró respuestas en formatos inesperados (como Markdown y JSON no válido). Incluso con las instrucciones, es posible que los resultados varíen mucho. Cuando implementes cualquier aplicación o extensión de Chrome con IA integrada, puede ser útil agregar una solución alternativa para garantizar que el resultado siempre tenga el formato correcto.
- Límite de tokens: Es fundamental administrar el uso de tokens. CyberAgent usó propiedades y métodos como
inputUsage,inputQuotaymeasureInputUsage()para administrar sesiones, mantener el contexto y reducir el consumo de tokens. Esto fue especialmente importante cuando se definieron mejor los títulos. - Restricciones de tamaño del modelo: Como el modelo se descarga y se encuentra en el dispositivo del usuario, es mucho más pequeño que un modelo basado en el servidor. Esto significa que es fundamental proporcionar suficiente contexto en la instrucción para lograr resultados satisfactorios, especialmente para el resumen. Obtén más información para comprender los tamaños de LLM.
CyberAgent enfatiza que, si bien los modelos del cliente aún no están disponibles de forma universal en todos los navegadores y dispositivos, y los modelos más pequeños tienen limitaciones, aún pueden ofrecer un rendimiento impresionante para tareas específicas. La capacidad de iterar rápidamente y experimentar sin costos del servidor la convierte en una herramienta valiosa.
Sugieren encontrar un equilibrio y reconocer que las respuestas perfectas son difíciles de lograr con cualquier IA, ya sea del servidor o del cliente. Por último, ven un futuro en el que un enfoque híbrido, que combine las fortalezas de la IA del servidor y del cliente, desbloqueará un potencial aún mayor.
Con la mirada puesta en el futuro
La exploración de CyberAgent de la IA integrada muestra las emocionantes posibilidades de integraciones de IA sin inconvenientes para mejorar las experiencias del usuario. Su extensión, creada para funcionar con Ameba Blog, demuestra cómo estas tecnologías se pueden aplicar de manera práctica para resolver problemas del mundo real y ofrece lecciones valiosas para la comunidad más amplia de desarrollo web.
A medida que la tecnología madure y se expanda la compatibilidad con navegadores y dispositivos, esperamos ver aplicaciones aún más innovadoras de la IA integrada y otras formas de IA del cliente.
Recursos
- Más información sobre la API de Prompt
- Comienza a usar las APIs integradas en Chrome
- Caso de éxito de CyberAgent sobre la IA web, que aborda este mismo tema.
- Mira The future of AI is now, los casos de éxito de CyberAgent sobre la IA del cliente
Agradecimientos
Gracias a los bloggers de Ameba, ao, Nodoka, Erin, Chiaki y socchi, que proporcionaron comentarios y ayudaron a mejorar la extensión. Gracias a Thomas Steiner, Alexandra Klepper y Sebastian Benz por su ayuda para escribir y revisar esta entrada de blog.