Tag Archives: optimización

Descargar en paralelo el sprite de css

Hace unas semanas participe del concurso webperf-contest. Un excelente concurso de WPO con un claro objetivo: mejorar la perfomance de un sitio. Para lograr eso reescribí todo el código frontend aplicando todas las técnicas de WPO que sabía: Unificar y poner en el head todo el CSS Unificar el Javascript Cargar los Javascript de forma Async Compactar el JS, CSS [...]
Posted in performance | Also tagged , , , , , | 2 Comments

La evolucion de ga.js y el mejor script de Google Analytics

(The english version) Hay un muchos articulos que hablan sobre el problema de bloqueo del browser cuando carga archivos externos de js.  En resumen:  cuando el browser encuentra <script src=…, este bloquea el dibujado de la pagina, hasta que el archivo js es descargado y ejecutado. Steve Souder presento un completo analisis sobre varias tecnicas para resolver [...]
Posted in performance | Also tagged , , | 5 Comments

Cargar Javascript sin bloquear

Es sabido que el tag <script> es bloqueante y frena el browser hasta que descarga, compila y ejecuta su contenido, por ende es altamente recomendable poner todos los scripts al final de la pagina para no demorar el rendering de la misma.  Adicionalmente, hay algunas técnicas para cargar de manera asincronica (no bloqueante). De todos los [...]
Posted in performance | Also tagged , , , | Leave a comment

Tip – Monitoreos de performance, el punto de partida y de fin de cualquier optimización web

Desde hace un tiempo estoy trabajando en varios proyectos de optimización web, sobre todo en abocado al frontend. Y vengo recomendando en este blog algunas coas a tener en cuenta. Debo decir que mas allá de cual sea la técnica o herramienta que utilicemos para identificar los posibles problemas de performance de nuestro site, y cuales [...]
Posted in performance, webapps | Also tagged , , , , , , | 2 Comments

tip 14 – Optimización de Imagenes

Resumen: En estos tips vamos a ver las 4 técnicas mas útiles y simples para la optimización de imagenes para una web. Inclusive técnicas con los últimos adelantos de css y los render engine.  Los Tips de performance que vamos a desarrollar son: Formato, tamaño y compresión adecuada Convinar en css sprites Cache para imagenes Usar CSS Gradients para efectos El [...]
Posted in performance | Also tagged , , , , , | 1 Comment

tip 13 – Reducir la cantidad de Ajax Request

tip : utilizar alguna técnica de “Multi Part Ajax Request” Como ya sabemos, las webapp o website desarrollados con la técnica de ajax tienen muchísimas ventajas en performance y usabilidad sobre las webapps hechas con la clásica arquitectura  request-response.  Pero también es sabido que el costo de cada Request del navegador suele ser el mas caro a [...]
Posted in performance, webapps | Also tagged , , , | Leave a comment

tip 12 – Como paralelizar el trabajo del cliente y el servidor con “Flush”

Si bien en este blog se trabajo sobre la idea de que la mayor parte de las mejoras que se pueden realizar para optimizar la performance de un web site, no están en el código del servidor. Existen algunos casos que un pequeño truco puede ayudarnos mucho en una página que tiene una demora muy [...]
Posted in performance, webapps | Also tagged , , , , , | 2 Comments

Videos de Steave Souder en la universidad de Stanford

Les quería dejar el enlace a las tres primeras clases de ” High Performance Web Sites ” en facultad de Computer Science la universidad de Stanford dictadas por el investigador y ahora colaborador de Google Steave Souder. Los videos aquí Lamentablemente solo podemos ver las 3 primeras y si queremos ver el resto debemos pagar u$ 600. [...]
Posted in performance | Also tagged , , , , | Leave a comment

tip 11 – Descargas en paralelo

tip: utilizar entre 2 y 6 hostnames para componentes estaticos (CSS, JS e Img) Por una especificación de HTTP 1.1 muchos navegadores tienen el limite de descarga de hasta dos componentes en paralelo por hostname. Obviamente esto perjudica la performance de carga de nuestra web. Aunque por suerte en las últimas versiones de Firefox, IE, [...]
Posted in performance | Also tagged , , , , | 4 Comments

tip 10 – Evitar el boqueo de la página por Adsense (u otro javascript)

Bueno, esta es una técnica para poder cargar y ejecutar scripts externos sin que estos bloqueen la renderización de la página y la descarga de otros componentes en el navegador. Como ya lo he explicado en los anteriores posts. El caso mas común donde esto afecta realmente nuestro site es con los ads, donde nosotros no [...]
Posted in performance | Also tagged , , , | 7 Comments