Tag Archives: frontend

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

Monitoreo de la performance real con Google Analytics

(English Version) Google Analytics es un exelente servicio para poder ver el comportamiento de los visitantes de un site. Con solo copiar y pegar algun script podemos saber un muchas de cosas. Pero este servicio no nos dice nada sobre cuan rapido / lento es nuestro sitio para los visitantes, y como ya hemos hablado muchas [...]
Posted in performance | Also tagged , , | 3 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

Load ads defered (without blocking)

Load ads defered (without blocking) Ads’s scripts are evil, most part of them use document.write to create a new script element, and then it load an other script which make an iframe which load other script which make….and finally your page were blocked, not rendering, until ads are loaded. We solved this problem using a very stupid [...]
Posted in performance | Also tagged , , , , , | 3 Comments

Cargar imagenes a demanda y ganar performance

(The english version) Escribí un pequeño script basado en jquery para mejorar la performane al cargar una página. La idea es simple, el script hace que la página cargue solo las imagenes que muestra a medida que el usuario hace scroll. Es muuuuy fácil de usar. Lo único que tenes que hacer es cambiar la url de la [...]
Posted in performance | Also tagged , , , , | 5 Comments

Images ondemand

This is a very easy technique to improve web page performance by implementing the tip “Make fewer HTTP Requests“. How? By avoiding downloading images that users will never see. For instance, you can see what happens on firebug when the browser has to download all thumbnails from a popular blog post, which has a [...]
Posted in performance, webapps | Also tagged , , , , , , | 1 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 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 8 – El mejor amigo del optimizador web : YSLOW

Para los ansiosos, el tip: entra y descarga el YSLOW aca Ahora si la explicación: Desde que me dedico a optimizar webapps y websites la mejor herramienta que he encontrado es el YSlow, cuya traducción es un juego de palabras que significa: “Por que es lento”. El YSlow es un plugin para el Firebug que es [...]
Posted in performance, webapps | Also tagged , , , , , | Leave a comment

Tip 7 – Como optimizar una web – Donde empezar

En este post voy a brevemente tratar de comentarles como llevar adelante una optimización de un website o webapp. En principio, debemos entender como trabaja un browser, la red y el web server.  Luego, ponernos en contexto de cual es el tipo de web que vamos a analizar: si es de contenido, publica o privada, etc. Quizás [...]
Posted in performance | Also tagged , , | Leave a comment