jquery.app
Espanol
EnglishDeutschFrancaisEspanol日本語Nederlands

Herramientas HTML

Generador de atributo fetchpriority

Genera atributos fetchpriority para imágenes, scripts y etiquetas link.

Cargando herramienta...

Qué es Generador de atributo fetchpriority?

Generador de atributo fetchpriority es una herramienta de navegador para esta tarea: Genera atributos fetchpriority para imágenes, scripts y etiquetas link. La salida es fácil de revisar antes de usarla en un sitio publicado.

Quick answer

Use fetchpriority='high' only for the one image or resource most likely to become the Largest Contentful Paint element. Do not mark many resources as high priority -- the browser still decides loading order.

Limitations

  • fetchpriority is a hint, not a directive. The browser may ignore it based on heuristics.
  • Older browsers including Safari 15.4 and below do not support fetchpriority.
  • Overusing fetchpriority='high' on many resources dilutes the hint and may not improve loading performance.

Cómo usar esta herramienta

  1. Abre la herramienta y escribe los valores necesarios.
  2. Revisa la salida en el panel de resultado.
  3. Copia solo la parte que encaja con tu página.
  4. Prueba el cambio antes de publicar.

Para qué puedes usarla

  • Resolver tareas repetidas de publicación con menos fricción.
  • Preparar marcado, CSS o checklists antes del lanzamiento.
  • Evitar pequeños errores comunes en sitios estáticos.

Errores comunes

  • Copiar la salida sin revisarla.
  • Usar URLs locales en lugar de URLs públicas finales.
  • No confirmar que el archivo esté en la carpeta publicada.

Verification

  1. Open Chrome DevTools Network panel and inspect the Priority column to confirm the fetchpriority hint is reflected in the browser loading order.
  2. Compare LCP timing with and without the attribute using the Performance panel to verify actual improvement.

Comparison

fetchpriority vs loading="lazy"

Aspectfetchpriorityloading="lazy"
What it controlsRelative loading priority of a resource compared to other resources on the same pageWhether the browser delays loading the resource until it is near the viewport
When to useOn the LCP element to load it sooner, or on non-critical resources to deprioritize themOn images and iframes below the fold to defer their load until the user scrolls near them
Effect on LCPCan improve LCP when set to high on the hero imageCan worsen LCP if applied above the fold. Only use below the fold.
Valid on which elementsimg, link, script, iframeimg, iframe
Browser supportChrome 101+, Edge 101+, Safari 16+, Firefox 122+Chrome 77+, Edge 79+, Safari 15.4+, Firefox 75+

fetchpriority hints at relative priority for loading while loading="lazy" defers loading until the element is near the viewport. They address different performance concerns and can be used together on the same element.

FAQ

Preguntas sobre Generador de atributo fetchpriority

Generador de atributo fetchpriority funciona localmente?

Si. Las herramientas actuales están pensadas para generar salida en el navegador.

Debo probar el resultado?

Si. Revisa siempre la salida en tu plantilla, navegador y hosting.

Herramientas relacionadas

Más herramientas html

Prueba también

Prueba también