Mejores Prácticas para Frames

Aprende las mejores prácticas para construir excelentes experiencias con Frames.

INFO

Estas mejores prácticas asumen un conocimiento previo de Frames. Si buscas información general sobre cómo construir Frames, consulta estos recursos:

• Comenzando
• Especificación de Frames
• guías de frames.js o frog

UI / UX

Sigue las Frame Interface Guidelines (FIG)

El FIG proporciona una guía exhaustiva que puede ayudarte a diseñar una gran experiencia para frames. Cubre todo, desde temas fundamentales como diseño y tipografía hasta mejores prácticas al trabajar con transacciones.

Optimiza el rendimiento

Haz que tu frame responda al usuario lo más rápido posible. Revisa e implementa las mejores prácticas de rendimiento.

Usa estilos y componentes reutilizables

Construir un conjunto de estilos y componentes reutilizables puede ayudarte a avanzar rápidamente y crear interfaces consistentes.

FrogUI es una extensión del Framework Frog que proporciona un conjunto de componentes primitivos personalizables.

Mejores Prácticas de Rendimiento

TIP

No te preocupes por estas recomendaciones si recién estás comenzando o trabajando en un prototipo.

¡Recuerda, la optimización prematura es la raíz de todo mal!

Usa imágenes en caché

Cuando sea posible, sirve imágenes en URLs estables con encabezados de caché apropiados, ya que esto puede reducir drásticamente el tiempo de renderizado.

Responde a las solicitudes lo más rápido posible

No realices cálculos de larga duración, como interactuar con un LLM, mientras el usuario espera que se cargue el siguiente Frame. Consulta realizar cálculos de larga duración en segundo plano.

Realiza cálculos de larga duración en segundo plano

Si tu Frame necesita realizar un cálculo de larga duración, como interactuar con un LLM o enviar una transacción onchain, debe hacerse en "segundo plano" respondiendo inmediatamente con un frame que indique al usuario que se está realizando una acción y permita al usuario actualizar para verificar el estado.

Usa una copia local de los datos de Farcaster

Si tu frame necesita acceder a datos de Farcaster, considera usar Shuttle para replicarlos en Postgres para que puedan ser obtenidos localmente.

Advanced

Mantener una base de datos replicada implica un trabajo no trivial. Considera obtener datos de un proveedor como Neynar, Pinata o Airstack a menos que estés dispuesto a asumir este costo.

Omite la verificación de la firma del mensaje del Frame cuando sea apropiado

Puede que no necesites verificar el mensaje del frame si los datos en el mensaje no resultan en la actualización o exposición de datos sensibles.

Por ejemplo, si tu frame devuelve datos analíticos públicos sobre el historial de casts de un usuario, confiar en los datos no verificados probablemente sea suficiente.

Nota

Para frames de múltiples pasos, puede que algunas interacciones requieran verificación mientras que otras no.

Ejercita precaución

Si tu frame depende del mensaje para permitir al usuario realizar una acción privilegiada o exponer datos sensibles, debes verificar el mensaje.

Minimiza la latencia de dependencias externas como hubs

Esta es una generalización de tácticas como omitir verificación y usar una copia local de los datos de Farcaster.

Identifica todas las dependencias externas de tu servidor de frames. Para cada una de estas dependencias externas, pregúntate lo siguiente:

• ¿Se puede eliminar?
• ¿Se pueden almacenar en caché los datos?
• ¿Se puede ubicar junto a mi servidor de frames?