Optimización de velocidad al foro

Hace varios días quería optimizar el foro para mejorar el tiempo de carga. Recién agarré y lo hice logrando muy buenos resultados.

Antes: ~40 segundos.
Ahora: ~8 segundos.

Estadísticas:
WebPageTest: http://www.webpagetest.org/result/140214_WM_MGJ/
PageSpeed Insights: http://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fwww.worldofeditors.net%2F&tab=desktop

Gracias a:
https://kraken.io/ : Por optimizacion en imágenes.
http://draeton.github.io/stitches/ : Por la automatizacion en la creacion de sprites.

Saludos.

Realmente muy buen trabajo Ruke, me quito el sombrero.

En contestación al MP, sí, se carga mas rápido, desde navegación privada inclusive (?)

Sos groso, sabelo

Ruke, optimizando nuestras vidas internautas

Wow.. gran trabajo.. pero tengo una curiosidad de como lo hiciste?

TRISTAN escribió:Wow.. gran trabajo.. pero tengo una curiosidad de como lo hiciste?

1) Reduciendo el numero de peticiones (por ejemplo, cada imagen, es una petición) haciendo uso de sprites (se unen varias imágenes en 1 sola).

2) Usando los formatos correctos para las imágenes.

JPG: Se usa cuando la imagen no es chica, tiene varios colores y no requiere transparencia. Si se puede, usar JPG progresivo.
GIF: Se usa cuando la imagen tiene pocos colores y require opcionalmente una transparencia no muy detallada.
PNG: Se usa cuando se requiere maxima calidad y transparencia o la imagen es chica.

3) Reduciendo ligeramente calidad y sacando caracteres innecesarios tanto en imágenes como en javascript (minify).

Excelente trabajo Ruke, siempre pensando en el bien de todos y como mejorar las cosas


PD: ¡aguante Saurista!

Ruke escribió:

TRISTAN escribió:Wow.. gran trabajo.. pero tengo una curiosidad de como lo hiciste?

1) Reduciendo el numero de peticiones (por ejemplo, cada imagen, es una petición) haciendo uso de sprites (se unen varias imágenes en 1 sola).

2) Usando los formatos correctos para las imágenes.

JPG: Se usa cuando la imagen no es chica, tiene varios colores y no requiere transparencia. Si se puede, usar JPG progresivo.
GIF: Se usa cuando la imagen tiene pocos colores y require opcionalmente una transparencia no muy detallada.
PNG: Se usa cuando se requiere maxima calidad y transparencia o la imagen es chica.

3) Reduciendo ligeramente calidad y sacando caracteres innecesarios tanto en imágenes como en javascript (minify).

Lo tomaré como consejo.

Una pena que el banner haya perdido calidad, en fin todo sea por mejorar la navegación lo que me recuerda poner un limite en las firmas.

Saludos.

Una pena que el banner haya perdido calidad, en fin todo sea por mejorar la navegación lo que me recuerda poner un limite en las firmas.

Es una calidad muy aceptable. Tanto que de hecho, la mayoría no notará diferencia con el anterior.

Con respecto a las firmas, la verdad es que podría ser... hay firmas que pesan casi 1 mb u.u

Se podría seguir optimizando, pero el tiempo de carga actual es aceptable (tal vez se podría pasar el optimizador de imágenes sobre medallas/logros/etc.).

jajaja "(tal vez se podría pasar el optimizador de imágenes sobre medallas/logros/etc.)." eso es extremista

EDITO: podríamos pelar la interfaz.. y así empezaríamos a valorar un poco mas los post y menos la calidad de las firmas y los avatars de tal y tal jajaja.. pero estoy seguro que perderíamos muchos user

Ruke escribió:

Una pena que el banner haya perdido calidad, en fin todo sea por mejorar la navegación lo que me recuerda poner un limite en las firmas.

Es una calidad muy aceptable. Tanto que de hecho, la mayoría no notará diferencia con el anterior.

Con respecto a las firmas, la verdad es que podría ser... hay firmas que pesan casi 1 mb u.u

Se podría seguir optimizando, pero el tiempo de carga actual es aceptable (tal vez se podría pasar el optimizador de imágenes sobre medallas/logros/etc.).

Respecto a las firmas hay Gifs o algunas de tamaño grande que sinceramente pueden joder la navegación, ya desde hace tiempo ando pensando en ponerle un limite.

Si te parece bien, puedes pasar el Optimizador en las imágenes de algunos campos como logros, medallas, profesiones aunque dudo que jodan mucho, ademas son pequeñas y PNG como recomendas.

TRISTAN escribió:jajaja "(tal vez se podría pasar el optimizador de imágenes sobre medallas/logros/etc.)." eso es extremista

EDITO: podríamos pelar la interfaz.. y así empezaríamos a valorar un poco mas los post y menos la calidad de las firmas y los avatars de tal y tal jajaja.. :Dpero estoy seguro que perderíamos muchos user

Desde mi punto de vista, el aspecto del foro influye en que haya un clima mas agradable a la hora de participar dentro de la comunidad.
Con esto me refiero a que, aveces la interfaz puede despertar el interés en el usuario con algunos pequeños detalles como logros, medallas y algunas cosas que implementé.

De algún modo un usuario se sentirá mas cómodo en un foro con buen aspecto que en uno todo blanco o de aspecto y colores de modo desprolijo. El Mercado, logros, profesiones, medallas, concursos despiertan el instinto competitivo de muchos(me incluyo) por lo cual asi se gana mas participación de parte de los usuarios y de algún modo no es muy monótona la web, le da un aire de diversión. n_n

Saludos.

estoy de acuerdo Sapphi, ami particularmente me nacen las 2 sensaciones tanto de la interfaz como de la competitividad por mercado y demás distinciones, pero estoy seguro que aunque sea poco creíble hay algunos que otros usuarios que aun así este optimizada le cueste en entrar jaja.. gracias a dios no es mi caso y para aportar una opinión, nunca vi una interfaz tan linda y ordenada como esta enhorabuena lastima el banner :/ jaja