Tabla de contenidos
Cuando hablamos de rendimiento, es difícil recordar todas las herramientas que pueden ayudar durante el desarrollo. Por eso compilamos una lista de herramientas de rendimiento para que tengas a mano.
1.- Prueba de velocidad móvil con Google
Test My Site de Google es una herramienta en línea ofrecida por Google e impulsada por la popular herramienta de rendimiento de sitios web WebPageTest.org . Puede visualizar el informe in situ o recibirlo por correo electrónico a través de su dirección de correo electrónico.
La herramienta le brinda el tiempo de carga de su sitio web (o índice de velocidad) calculado usando un navegador Chrome en un dispositivo Moto G4 dentro de una red 3G. También le brinda el porcentaje estimado de visitantes perdidos debido al tiempo de carga. Entre otras cosas, también:
- Compara la velocidad de su sitio con los sitios de mejor rendimiento en su industria
- Ofrece las mejores soluciones que pueden ayudarte a acelerar el tiempo de carga de su sitio web.
2.- Lighthouse de Google
Lighthouse es una herramienta de código abierto para ejecutar auditorías para mejorar la calidad de la página web. Está integrado en DevTools de Chrome y también se puede instalar como una extensión de Chrome o una herramienta basada en CLI. Es una herramienta indispensable para medir, depurar y mejorar el rendimiento de las aplicaciones modernas del lado del cliente (particularidad PWA). Puedes encontrar la extensión en Chrome Web Store .
3.- YSlow
YSlow es un marcador de JavaScript que se puede agregar a su navegador e invocar en cualquier página web visitada. Esta herramienta analiza las páginas web y le ayuda a descubrir las razones de la lentitud según las reglas de Yahoo para sitios web de alto rendimiento.
Puedes instalar YSlow arrastrando y soltando el marcador en la barra de marcadores de su navegador. Encuentra más información aquí .
4.- Gmetrix
GTmetrix es una herramienta en línea que le brinda información sobre el rendimiento de tu sitio web (tiempo de carga completa, tamaño total de la página, número de solicitudes, etc.) y también recomendaciones prácticas sobre cómo optimizarlo. Tiene un modo libre de costo y otro más completo que es de pago.
5.- Page performance
Page performance es una extensión de Chrome que se puede utilizar para ejecutar un análisis de rendimiento rápido. Si tienes muchas pestañas abiertas, la extensión analizará en la pestaña activa.
6.- Proyecto AMP
El proyecto AMP (Accelerated Mobile Pages) es un proyecto de código abierto que tiene como objetivo hacer que la web sea más rápida. El proyecto AMP permite a los desarrolladores crear sitios web rápidos, de alto rendimiento y con excelentes experiencias de usuario en todas las plataformas (navegadores de escritorio y dispositivos móviles). El proyecto AMP consta básicamente de tres componentes básicos:
- AMP HTML: es HTML pero con algunas restricciones para garantizar un rendimiento confiable.
- AMP JS: una biblioteca de JavaScript que se encarga de renderizar AMP HTML.
- Caché AMP: una red de entrega de contenido para almacenar en caché y entregar páginas AMP válidas. Puede utilizar herramientas como AMP Validator o amphtml-validator para comprobar si sus páginas son páginas AMP válidas.
Una vez que agregues el marcado AMP a tus páginas, Google las descubrirá automáticamente y las almacenará en caché para entregarlas a través de AMP CDN. Puedes aprender aquí cómo crear tu primera página AMP.
7.- Penthouse
Penthouse es un generador de CSS de ruta crítica que te permite obtener el CSS necesario para representar el contenido de la mitad superior de la página de una página específica. Solo necesita especificar el archivo CSS completo de tu sitio web y una página de destino.
8.- ImageOptim
Image Optim es una aplicación gratuita y de código abierto para Mac que optimiza el tamaño de las imágenes. También está disponible como un servicio en línea de pago . Hay otras alternativas en linea como las siguientes:
- Online interface : Un compresor JPEG que produce archivos más pequeños y de mayor calidad. La interfaz web funciona con cualquier sistema.
- Pinga : De código cerrado, pero similar a ImageOptim.
- FileOptimizer Descargable que admite muchos formatos de archivo y es gratuito y de código abierto.
- Pngquant – Compresor PNG. Tiene algunas aplicaciones GUI compatibles con Windows y complementos de Photoshop disponibles.
