1. Sprites (imagen de fondo de sprite / imagen de sprite)
1- Incluya múltiples imágenes o íconos esporádicos en una imagen grande, de modo que solo se deba cargar una imagen en lugar de muchas imágenes, lo que reduce muchas solicitudes http
2-Usando la combinación de imagen de fondo, repetición de fondo y posición de fondo de CSS para el posicionamiento de fondo, la posición de fondo puede localizar con precisión la posición de la imagen de fondo con números;
En segundo lugar, reduzca la cantidad de solicitudes http
CSS Sprites, JS, compresión de código fuente CSS, el control del tamaño de la imagen es apropiado; página web Gzip, alojamiento CDN, caché de datos, servidor de imágenes.
Tres, componentes de carga retardada
Puede echar un vistazo más de cerca a la página y preguntarse: ¿Qué es necesario para representar la página en primer lugar? Puede esperar el resto del contenido.
JavaScript es una opción ideal para separar antes y después del evento de carga. Por ejemplo, si tiene código JavaScript y bibliotecas que admiten la función de arrastrar y soltar y la animación, puede esperar un poco porque los elementos de arrastrar y soltar se encuentran después de que la página se renderiza inicialmente. Otras partes que se pueden cargar con pereza incluyen contenido oculto (contenido que aparece después de una determinada acción interactiva) e imágenes contraídas.
Las herramientas pueden ayudarlo a reducir su carga de trabajo: YUI Image Loader puede cargar imágenes plegadas de manera perezosa, y la utilidad YUI Get es una forma sencilla de introducir JS y CSS. La página de inicio de Yahoo! Es un ejemplo, puede abrir el panel de red de Firebug para verlo más de cerca.
Es mejor combinar los objetivos de rendimiento con otras prácticas recomendadas de desarrollo web, como la "mejora progresiva". Si el cliente admite JavaScript, puede mejorar la experiencia del usuario, pero debe asegurarse de que la página funcione correctamente sin JavaScript. Entonces, después de confirmar que la página se está ejecutando normalmente, puede mejorarla con algunos scripts de carga retardada para admitir algunos efectos magníficos como arrastrar y soltar y animación.
Cuatro, acaba con el 404
Las solicitudes HTTP son caras y no es necesario utilizar una solicitud HTTP para obtener una respuesta inútil (como 404 Not Found), que solo ralentizará la experiencia del usuario sin ningún beneficio.
Algunos sitios utilizan el útil 404- "¿Quieres decir xxx?" Esto es bueno para la experiencia del usuario, pero también desperdicia recursos del servidor (como bases de datos, etc.). Lo peor es que el JavaScript externo vinculado tiene un error y el resultado es un 404. Primero, esta descarga bloqueará las descargas paralelas. En segundo lugar, el navegador intentará analizar el cuerpo de la respuesta 404, porque es código JavaScript y necesita averiguar las partes disponibles.
Cinco, minimiza el acceso al DOM
El acceso a los elementos DOM con JavaScript es muy lento, por lo que para que la página reaccione más rápidamente, debe: almacenar en caché el índice de los elementos a los que se ha accedido
, actualizar los nodos "sin conexión" primero y luego agregarlos al árbol DOM.
Evite usar JavaScript para solucionar problemas de diseño
6. Regala Cookie para adelgazar
Hay muchas razones para utilizar cookies, como la autorización y la personalización. La información de las cookies en el encabezado HTTP se intercambia entre el servidor web y el navegador. Es importante asegurarse de que las cookies sean lo más pequeñas posible para minimizar el impacto en el tiempo de respuesta del usuario.
Borre las cookies innecesarias para
asegurarse de que las cookies sean lo más pequeñas posible para minimizar el impacto en el tiempo de respuesta del usuario.
Preste atención a configurar el nivel de dominio adecuado para las cookies, para no afectar a otros subdominios.
Establezca períodos de validez apropiados, períodos de validez anteriores o ninguno se puede eliminar más rápido Cookies, mejoran el tiempo de respuesta del usuario
Bienvenido a unirse al grupo para discusiones técnicas, número de grupo: 954314851
