 Bueno, aquí está la ponencia Nifor Speed at Workpress, por el tema de que es el velocidano. Bueno, me presento. Soy el estado de soporte especializado de profesión a Hosting. Nuestro servidor en nuestro Hosting lo que tiene dos departamentos, uno de soporte normal para todos los temas de lo que es el servidor, de lo que es el sistema de corretares y luego está el soporte especializado que es el soporte que damos al cliente sobre 70 FMS, pues a Workpress, PrestaSoft, Jumla, etcétera. Entonces ahí soy yo el director de soporte donde voy ayudando a todos nuestros clientes con dudas, problemas que tengan, etcétera. Vale, para explicar un poco lo que hago. Luego hago el mita, organizo el mita de Workpress Almería, escribo en el blog de personalhosting, el blog de PrestaSoft y también tengo un pequeño podcast sobre PrestaSoft ya que Workpress tiene mil podcasts, pues, pase de cambio de tiempo. Y bueno, vamos a hablar un poco de qué es el WPO, vale, porque de esta charla va de WPO, de optimización. Y para mí el WPO pues es una carrera en la que estamos siempre luchando por ser el primero, o estar el primer coche delante o la primera web delante para unos ciertos beneficios que nos va a dar. Pero qué es el WPO realmente? Bueno, es un acrónimo de las siglas de que quiere decir web performance optimization. Es un conjunto de técnicas orientadas a mejorar el rendimiento de la página web. Todo esto tiene unas ventajas, tener una mejora o una mejor velocidad y son estas cinco de aquí. La satisfacción del usuario, el posicionamiento, el porcentaje de conversión, el coste de las campañas publicitarias y el coste de infraestructura. La satisfacción del usuario influye positivamente en la conversión y podemos ver claramente de ejemplos como de los grandes, como Amazon, Facebook, Google y Yahoo, pues la diferencia que pueda haber en una optimización bien hecha o si no están optimizados. Por ejemplo, Amazon dice que si pierde 0,1 segundo de retraso, de retraso implica una pérdida de 1%. Imaginaos ser 1% de Amazon cuánto puede ser, puede ser la hostia, ¿no? Y 0,1 segundos cuánto es. ¿Alguien nota cuánto es un 0,1 segundo más? Nadie, ¿no? Pero todo eso está volado a grandes cifras, pues. ¿Puede imaginar cuánto puede ser? Facebook tira más o menos de lo mismo de que si medio segundo más lento tiene un 3% de caída, Google Maps, que hizo una optimización de sus imágenes hace unos años y dijo que, bueno, la redujo a un 30% y dijo que había aumentado el tráfico o número de peticiones de un 30% más. O sea, optimizando imágenes consiguió tener más tráfico todavía. Y bueno, Yahoo más o menos por lo mismo. El posicionamiento en buscadores. Aquí entra Google siempre A, que es el dueño de Internet, digamos, y en 2010 dijo que... o publicó que iba a tener en cuenta la velocidad en los servidos. Todo aquella página web que fuese rápida, que fuese más rápida, le iba a tener en cuenta en su ranque de posicionamiento, lo tanto, que era rápida y iba a subir de posición. Como siempre, Google cambió la tortilla, le daba la vuelta, en 2013, que dijo que el que no fuese rápida la penalizaba, o sea, el trabajo de la posicionamiento. Siempre Google dice que, por el usuario, por la satisfacción del usuario, que en una página usted luego tiene la otra parte, que es que a ellos le cuesta mucha pasta, porque está rastreando toda la web del mundo, y cuanto más rápido sea, por menos tiene una recuesta. Por eso estaba tan obsesionado siempre con la velocidad. Esto es lo que más nos tiene que interesar sobre el tema del UWP, ¿no? Y que dice que cada segundo de más puede haber una pérdida de un 7% y un 11% de pérdida de conversión. Yo siempre tomo el mismo ejemplo. Y digo, esto es como cuando soy joven, y está innovando, y está con tu pareja y dice, ¿me quieres? Si tardas más, tú no puedes responder, esa noche no convierte. Si tardamos mucho en responder, pues posiblemente la conversión va a ir a peor. Bueno, según estudios realizados por Amazon, Google y Google, pues eso, que se parecen todos los usuarios, esperan que una página cargue en menos de 2 segundos. Todo esto porque los grandes, como Amazon y demás, van tan rápidas que no nos han acostumbrado usar sus páginas web, y nos pensamos, o el usuario básico, se piensa que todo, que no entiende la audiencia, no entiende la página web, no entiende nada, a mí me han llegado a decir con una página que tenía 10 megan imágenes, que quería que fuese igual de rápido que Amazon. Es decir, no compenses tu web con las servidores de Amazon, con sus clientes de Amazon, o que no tienen el conocimiento. Entonces, como estamos tan acostumbrados a eso, pues dice que si tardas más de 2 segundos, posiblemente el usuario abandone. Si tardas 3 segundos, ya el 40% seguramente abandone, o abra otra página, porque al abrir otra página, al final, te va a cerrar y no te hace mucho caso. El 14% cambia, de tiendas likes y su página tarde a encargar, el 64% de los compradores, aunque realicen la compra, pero si hay una leyenda, posiblemente, en un vuelvo, y también se dice mucho que el tema de la audiencia da una sensación en el tema de la seguridad. Sobre todo entienda el comercio electrónico, porque si nosotros estamos en el paso del proceso de compra, tenemos un objeto sensible que le vamos a dar a la web para que no haga el cobro, y en ese momento se vuelve a la página de lenta, se cuelga, etcétera, pues los usuarios como somos, pensamos lo peor del mundo, y si parece que es cual, me está robando la tarjeta, me está haciendo lo peor, pero si le da una lucia muy rápida a ese usuario, no se lo piensa, no le das tiempo a pensar que no es falta el penúltimo coce de campañas publicitarias. Una fórmula que tiene, cuando invertimos en AdWords, es para posicionar dentro del ranking de AdWords, es el nivel de calidad o el CPC máximo. O sea, si nosotros pagamos un CPC para salir, digamos, por cualquier palabra clave y la primera, también tiene eso en cuenta con el nivel de calidad, y la velocidad cuenta dentro del nivel de calidad. ¿Qué quiere decir con esto, que si nuestra competencia puede ser que nosotros paguemos menos y salgamos por encima suya, siempre y cuando el nivel de calidad nuestro sea mejor, y tenga una buena definición. Por eso nos podemos ahorrar costes en AdWords, nada más que por el tema de la velocidad. Y también, ¿por qué hace Tover? Porque Google quiere velocidad. Está obligando al final de una forma o otra que le dé velocidad para que ellos consuma menos su tiempo de rastreo y demás. Y por último, el coste de la infraestructura, que bueno, es lógico que si nos imagina más rápida necesitamos menos procesamiento, menos memoria RAM, menos ancho de banda y demás. La utilización que ahora vamos a ver dice que es más mejora entre un 15% y un 25% de velocidad, y bajo el consumo del CPU 40% y está un 50% de ancho de banda. Así que, claro, la potencia es igual. Pero esto afecta al SEO, de verdad. ¿Hay aquí algún set? ¿Tú? ¿Afecta al set? ¿Sí? Decían que el UWP no lo sé, dicen que el PWWA no lo sé. ¿Eh? PWWA. Sí. Te metes en Wordpress TV y yo den un ancho de PWWA y me sorprende. Te la pueden mirar. Muy mal. Bueno, pues sí, afecta realmente. Aquí, como vemos, la optimización que se hizo ha ido mejorando. O sea, las páginas de rastreo al día han subido, como vemos, los kilobytes de rastreo también y porque el tiempo, como vemos, ha bajado bastante. Entonces, sí, afecta realmente el UWP. Tenemos que saber qué factores tenemos en cuenta para tener un buen optimización. Realmente, son dos. Uno en la programación y otro en el servidor. Y volviendo a la semejanza de los coches o de la velocidad, para mí la programación nuestro coche va a ir muy rápido en las curvas. O sea, se va a poder meter a gran velocidad y vamos a ir muy rápido y incluso a levantar. Entonces, la programación con Wordpress, digamos que la tenemos casi solventada porque Wordpress está bien programado, va rápido y tiene un correo que está bien. Pero tenemos que tener cuidado con los plugins y demás. Porque hay muchos plugins que no están utilizados para la velocidad y pues es que perdamos. Y no abusar de ellos. Cuanto más plugins instalemos en nuestro Wordpress posiblemente vaya mal. Y hay algunos temas, como sabés, sin estarlo. Que afecta mucho la velocidad de ese sitio. Nos da mucho recursos, nos da mucho ventaja en muchas cosas que hacer, pero la velocidad hay una caída o un bajón de velocidad. ¿Vale? Y por otra parte, tenemos el corazón del coche que sería el motor. Que sería la parte que empuja. Esto digamos que es el servidor. ¿Y cuál es el problema que tenemos en España? ¿Por qué? En Google, la institución de búsqueda primero que dice es Hosting gratuito. Y que crea que un Hosting gratuito vaya rápido. Entonces, tenés que realmente hacer una pequeña inversión en que vosotros Hosting esté optimizado y vaya con que funcione. Por ello recomiendo una serie de puntos para tener un Hosting que sea decente y que funcione en posición. Procesador de alto rendimiento al igual que en un ordenador normal, necesitamos un procesador que rinda a gran velocidad para que nuestra página vaya bien. Yo recomiendo a partir de 2,5 gigálices hacia arriba. Nosotros vamos a montar entre 3,5 y 3,7. Eso te va a aportar algo más de velocidad. Disco duro en SSD es importantísimo porque si ya lo tenemos también en los portátiles en un portador normal, pues no vamos a tener el servidor. El disco duro en SSD duplica la velocidad de lectura y de escritura. Igual, préstamos los CMS, hace mucha escritura de lectura de caché y eso nos va a mejorar la velocidad. Centro de alto en España, muy importante. En España como en nuestro país dependiendo de nuestro público o de nuestro usuario. Cuanto la latencia sea menor de donde nosotros estamos hacia el servidor, lógicamente va a ir más rápido. Eso es por el tema de la latencia. Y bueno, ya si lo veis por el tema de calidad y estabilidad de los placentes, los centros de datos se mide tier 1 hacia adelante y tier 3, tu sería el mejor. Y luego por debajo tenemos el software que es tan importante como el hardware y es tener una configuración especial o dedicada para WordPress. Esto no lo va a decir ningún hosting no va a decir qué configuración tiene ellos pero sí que tenéis que tener encuentro de que realmente estén especializados y eso al final es prueba de error y probar hasta que uno realmente te funcione bien con WordPress. Positividad o compatibilidad con pachete si es de IMAX, IMAX EQ de 5.6 de adelante, esto quiere decir que tener la última versión de pachete o IMAX EQ te va a garantizar la velocidad ya que estas versiones son mucho más rápido que la anterior. Por lo menos la posibilidad es poder utilizar la última versión y si lo podéis cambiar de panel mucho más. Sistemas de caché basado en RAM como mencaché, apcé o pecaché varnish Victorización y aislamiento de clientes con clorinos esto lo que quiere decir es que lo que no debería puede afectar a todo el mundo pero con un sistema de aislamiento no pasa sobre un camparia S y ya que estaba pues una media anti-hack para que no te hagué y pueda perder la versión. Bueno, pero vamos a empezar. ¿Cómo vamos a medir? Antes de empezar con que la optimización siempre hay que medir y no vale con preguntarle al de al lado ¿Qué tal de tu página web? Tienes que hacer contés de medicina. Vale, entonces ¿A quién le gusta? Bueno, yo pienso igual para mí es la peor, es una mierda lo que tengo que tener en cuenta porque el posicionamiento para web ya sabéis lo que tenéis en cuenta y más a partir de junio que decía para mobile pinto, una de las que solo utilizar a diario te da una métrica muy buena y la solo utilizar mucho y también porque te deja seleccionar de donde lo quieres hacer para mí esta de las ambas es muy buena herramienta para hacer la medicina porque te hace 3T, te hace la media y luego te va sellando los dados como pinto, pero algo mejor y también podemos seleccionar un poco rápido porque me he dicho ya que me queda poco tiempo herramienta un poco más del nivel de servidor se llama Apache Bench y esto lo otro es para hacer una sola petición y esto yo lo utilizo para ver cuando hay usuarios simultáneos y mira estas peticiones con 50 usuarios simultáneos y miro a ver el nivel de carga te va dando unos pequeños datos y aquí se ve que el 50% de las peticiones por 5 segundos y va subiendo a 38 y así podemos ver extremizando realmente con usuarios simultáneos y no de uso al hotel de este tipo no implica que el fistbite para ello hay que entender primero lo que es el fistbite lo que es es el tiempo en el que se procesa nuestro coding y cuando tú lo ejecutas realmente todo lo que hace el procesamiento de todo ese código para mostrarte el html eso lo que se considera como el primer byte de carga o lo que el primero te muestra y esa es la parte más difícil de ver en una opción el fistbite vamos a ver el spirit index que esto es una fórmula que es de web test test que yo no entiendo pero lo que te hace esto es una punción que ahora veremos que es lo que quiere decir esto que realmente a google si lo que quiere primero o sea lo que quiere igual que todo no es que tenga página tarde de 20 segundos y por sus penalizas no puede tardar 20 segundos pero me muestras información rápida empieza a encontrar información cuanto antes aunque tarde mucho y aquí vamos a ver la diferencia 2 páginas web con 12 segundos de carga esta carga el 90% en un segundo y esto tarda el 90% en 11 segundos porque si las 2 páginas tardan 12 segundos segundo google para tardar 12 segundos porque realmente lo que importa es que tú le enseñes contenido o la gran parte del contenido al actuario cuanto antes si tú aquí la estás enseñando el 90% lo que quiere decir es que te está quedando quizás un Javascript externo o una llamada twitter una llamada Figuero que sea que está remaritando o está cardando en tu página web pero realmente todo el contenido se lo está mostrando y eso lo que google quiere que le muestre el contenido lo más rápido que le empieza a mostrar cosas ya y entonces por eso se mide con esta fórmula y se saca el spirit index de la optimización una optimización buena es menos de 2500 entre 2500 y 3500 digamos que una optimización que está bien y más de 3500 una optimización que no está muy bien vamos a optimizar primero una análisis de la página web el fees buy unos 22 segundos la hacemos el pinto y la hacemos el web pages aquí vemos el star render que quiere decir el momento en el que empezó a renderizarse el spirit index de 6200 y el fees buy y aquí lo vamos viendo con todo eso Profilings de WordPress lo primero pues ver qué está pasando con el p3 plugin performable ahí podemos ver qué es lo que está cargando los plugins que puede ser que tarden mucho en cargar luego tenemos el ww top que es para ver más en el código si tenemos algún problema y el wwp xh pro son también de tema de decoración esto no sea algo más técnico no es para verlo los primeros utilizaciones de base datos desactivar o reducir el número de revisiones aquí ha hecho alguna vez o ha quitado el número de revisiones o la unificar bueno haber levantado casi la mitad bastante bien pero normalmente casi todo el mundo se deja olvidado esto que hace que cualquier revisión se va a guardar un base dato y tenemos cuatro cosas todo eso no lo queremos para nada para esto, lo desactivamos directamente o lo reducimos yo tengo puesto por ejemplo dos, tres revisiones máximo por si queremos tirar de alguna pero no queda más, no esté todo el rato haciendo por cada cosa que cambia el pop que esté guardando una línea en la base data para ello como lo hacemos lo vamos a hacer directamente con el plugin wwp optimice lo instalamos, lo configuramos y lo bueno de esto es que también lo podemos configurar para que se haga de forma comandiva cada cierto tiempo ¿vale? optimización de la web que se está optimizando pasa de tener 1,08 GB 726 GB solo por el tema de revisiones y demás resultado de hacer esto pasa de 1,82 GB plugin de caché súper importante, la caché hay que tenerla así ¿qué es el plugin que yo recomiendo? es el único de pago pero merece la pimpad el wwp rocker para mí es un plugin que funciona muy muy bien esto es un test de load impad que te da 50 sores en montaño va viendo la carga de la web sin caché está tardando unos 4 segundos y luego un caché pasa de primera que no está cacheada tarda pero una vez que lo caché baja y es súper estable por lo tanto cuando tenemos un plugin de caché que empieza a meter pues ya no baja el tiempo de optimizar y a partir de ahí vemos que los tiempos mejoran exageradamente de pasar de 80,000 segundos a 85,000 segundos minificación de CSS JS y HTML esto quiere decir que yo tengo un plugin que es más legible que yo lo puedo ver pero para el robot esto no vale para nada si yo lo minifico en una sola línea que el robot lo va a entender perfectamente pero me estoy grabando todos los kilobytes que ocupa además este archivo entonces la descarga es más rápida por lo tanto la velocidad de carga mejor la combinación tanto de CSS como de JS esto ya no tiene mucho sentido por el tema de HTTP2 pero se solía hacer yo tenía muchos recursos y todos esos recursos si lo minificaba en uno solo, lógicamente sólo me descarga uno y no tenía que estar haciendo peticiones en cada uno pero luego hablaré de HTTP2 y cómo mejorable minificar y combinar CSS lo podemos hacer directamente con el plugin de Autostimism también se puede hacer con el WP Rocker no pasa que es como el de Pau si no lo queréis hacer gratuito si no lo tenéis podréis hacer directamente con esto pero hay que dar compresión, es decir, súper importante también si comprimimos nuestro contenido se va a pesar menos se va a descargar más rápido y va mucho mejor para ello tenemos que tener activado el Monteflot en el servidor, que normalmente todos lo tienen activos y meter una regla en HTTP sería algo como esto esto también lo hace el WP Rocker y cualquier plugin de Cachier normalmente desforma automática, si no lo podéis coger y pegar especificaciones de Cachier para la Cachier del navegador que esto sería la espina tanto el PagesPist lo ponen ¿Qué hace esto? que cuando yo me han sido a una página web todos los recursos estáticos, como son imágenes, CSS y demás, se lo descarga el navegador ¿Para qué voy a estar descargando todo lo que he visto en la página web? y esto es lo que se hace con el módulo Modespire en el servidor y esta regla me hace lo que estoy diciendo es que la imágenes tarde un año en no volver a descargarse porque imágenes no las suelen modificar así las CSS y demás pero cuando hacen modificaciones con esto no quería poner vídeo porque no me va a haber tiempo pero tener cuidado con la Cachier porque te pasaría algo en tu momento estoy cocinando lecho más sal y voy a probar lo mismo a veces pasa mucho con los clientes el hecho es cambio, yo lo veo igual yo lo veo igual para poder verlo el cambio que yo he hecho y si es bien vamos a pasar a utilizar imágenes también es bastante importante tener la utilización de imágenes bien hechas porque el gruelo en la mayoría de la carga son de imágenes hay muchos recursos para utilizar imágenes a mi me gusta esta web Resmusit me gusta bastante te lo utiliza bastante bien y baja mucho el peso aquí lo podemos ver que la original pesaba 351K vale que pasa ahora con el tema de la imágena del basilar en el progreso o la progresiva porque antes la imágena la vea y va cargando por trozos ahora lo que te hace es que te la pixela o se ve max pixel, con menos resolución y poco a poco se va viendo que esto no es un efecto bonito que lo da los diseñadores es por el tema de la imágena lo que pasa con esto que la página carga más rápido si la imágena se optimizara no le importa por el nuevo de la imágena carga más rápido pero realmente por detrás está mejorando la calidad como hacemos esto, lo podemos hacer con Photoshop con imágeo Optin, que es un programa con Resmusit o con Google Mod, PageSpeed por último el lazy lo hace que vaya cargando poco a poco estas digamos que la pantalla por aquí se carga esta imágena y esta porque la vea cargar por lo tanto con un plugin de lazy lo podemos hacer perfectamente para que evite muchos temas de peticiones y de carga de imágenes vamos a hablar del Mod PageSpeed al igual que decía que el PageSpeed inside no me ha gustado una mierda, este módulo me parece bastante bueno es un módulo que le ha hecho Google a nivel de servidor y te hace todo lo que me ha hablado anteriormente en un solo modo instalado a nivel de servidor y apenas hay que configurarlo la imágena tiene su propia caché te hace el lazy loa se hace una variedad de cosas qué pasa que tenés que tener acceso al servidor o tenés que tener un VPS para poder instalarlo o en su defecto tener un servidor que permita activar un compartido el tema este nosotros en profesión lo tenemos y sería tan sencillo como meternos dentro del panel press y activarlo para el dominio que nosotros queramos y ya lo teníamos activado y aquí es un ejemplo de lo que va haciendo por ejemplo la imágena convierte al formato que tiene Google que es un poquito mejor de compresión te lo metes en su caché y la imágena es jsd es bastante bueno y te mejora mucho la puntuación de los tianos de este módulo aquí terminando que me quedas ya estoy fuera de tiempo venga, me quedan un poder positivo CDN de mindset and xtp2 alguien sale con fdn es una distribución de contenido estático esto es muy bueno cuando obtenemos usuarios en nuestra página web que no es de por ejemplo yo tengo un servidor en españa y tengo usuarios de estados unidos de latinoamerica, de china, etc entonces con un acdn reparto todos mis recursos estáticos como css, javascript, imágenes por todos los usuarios del mundo y cada vez que un usuario de estados unidos por ejemplo entra a mi web le escupe todos esos recursos desde el servidor más cercano a él mejora mucho la latencia de conexión porque eso sería lo que es una cdn lo podemos hacer de forma caliente con cloveflare y lo tenemos a amazon, kcdn no mindset and es la técnica que se utilizaba anteriormente porque cualquier navegador hacía x peticiones simultáneas o x defensores simultáneas del contenido que he explicado antes de los css y javascript por ejemplo, creo que me parece que hacía 8 simultáneas, cargaba 8 recursos se esperaba que se, luego 8 otros 8 y así, entonces la gente lo metía en sus dominios, para que cargase de 8 por 3 sus dominios notificaba la velocidad de descarga simultánea que pasa que llegó htp2 y cargó esto porque con htp2 hace una sola conexión se descarga todos los recursos simultáneamente y hace reconexión por lo tanto, lo que recomiendo tener htp2 si o si activo en vuestro servidor y si tenéis más de un 20% de lo de tráfico fuera de España fuera de donde está vuestro servidor contratar una cdn, utilizar cloveflare al htp voy a explicar poco porque monté la aplicada antes y si no lo habéis visto, podéis ver su vídeo solo que el playin del lado indio al que yo utilizo, y me parece que también es mejor test final bueno pues, aquí vemos como vamos a dejar el test vamos a dejar el tiempo de cargar el tráfico que era 1.8, el peso y demás vamos a mejorar bastante bueno y antes de terminar no tiene mucho que ver con la charla el deseo se llama pxseo y bueno, si lo queréis mirar, es un plugin para compra que te analiza todo el tema de deseo on page de posicionamiento de k-war deseo local y k-war reserve y poco más pero y... bueno, ahora lo como bueno, nada, muchas gracias también la he echado antes de que el pxseo que esté en vuestro el pxseo que esté en vuestro el pxseo que se activa en paránteles si, mal de tiempo muchas depositivas si, de aquí directamente está aquí, en el panel flex si, dentro de la suscripción aquí estaría la primera suscripción todas las cosas que tienes instalas aquí, activas y guardas si quieres, al final de suscripción es el 2-minus o sea, por cada 2-minus de tu pantalla hay que activar por 1 o por 2 y ya puedes incluir qrl, por lo mejor la url de carrito no te interesa puedes incluir, para el bangofin dependiendo de lo que tengas y puedes curtar la caché cuando quieras muchas gracias que te comentaba ahí, que en esa parte tu un poco de caché va algo compatible? son compatibles, no pasa nada pero, lo que recomiendas no meterlo todo, o sea tener la conciencia más óptima vale, lo del pxseo también se puede configurar para que haga cosas y cosas no, para tu decirle pues solo quiero que unifique o solo quiero que haga la imagen, si además se puede configurar más? minificación, si, combinación no, combinación de yes, en un solo al pxseo no hace falta porque htp2 se lo descarga todo simultáneo minificación es combinar o sea, no es combinar, es de un pxseo que está estructurado listo? venga, si quieres una pregunta, ya me buscáis por ahí muchas gracias