 Bueno, bueno yo soy Néstor y bueno venimos a hablar un poco, me invito, me empujó, no voy a dar esta charla y hablar un poco del veo es un tema poco técnico, lo que pasa es que he intentado que sean poco agradables para todos y para todos los perfiles, tanto novato es como concluso agente programadora que podría aprovechar cierto conocimiento yo lo que voy a explicar hoy, sé más o menos, aquí explicamos lo que sabemos, pero bueno, es mi experiencia, sobre todo haciendo haciendo diseño web, me perdonáis que la primera mitad que hago y pues sé que este ha sido un poco lleno de risillas bueno, yo soy Néstor, tengo una pequeña agencia que es Aestic y no se me especializa directamente en WordPress con tutores de Elementor, ahora estamos hablando de Previewder, tiendas online como commerce, hacemos páginas dinámicas, no solo estáticas o sea, con herramientas que lo haría normalmente un programador, pero nosotros nos apoyamos en esas herramientas para crear webs pues tipo catálogo, de presentaciones ¿no? he maquetado con HTML, CSS, toco un posicionamiento SEO, marketing digital, he hecho diseño gráfico en Figma y he tocado bastante web que es lo que he venido a hablar hoy, he trabajado para diferentes marcas, tanto pequeñas como grandes haciéndole diferente, cada cliente me suele pedir o solo diseño, o solo maquetación, o hay clientes que lo han pedido web porque se ha montado su propio proyecto y quizá se estachara es un poco eso, entiendo que la mayoría habéis montado vuestro proyecto y he explicado un poco pues las buenas prácticas de los WPO ¿no? así que si estamos preparados WPO ¿qué es? Web Performance Optimization, lo voy a explicar para WordPress, porque esto es aplicable a cualquier tipo de lenguaje o que tipo de CMS, como estamos en mitad de WordPress pues hablamos para WordPress y aparte es lo que estamos más especializados ¿qué nos aporta en la WPO? pues principalmente la velocidad ¿no? todos pensamos cuando pensamos en performance pensamos que nuestra web quiere ir más rápida ¿no? ¿qué significa eso? no significa que cargue muy rápida sino nosotros cuando miramos performance no solo miramos el hecho de que la web cargue muy muy rápida sino que tiene otros aspectos como la accesibilidad, implícidamente ayudamos a que las personas con determinadas discapacidades pues puedan acceder al sitio y eso también nos puntúa hace mejorar nuestro performance ¿no? el posicionamiento si una web carga más rápido, si es más accesible posicionará mejor o Google lo valará mucho mejor ¿vale? y sobre todo lo que yo valoro más ahora de hacer WPO es que no centremos en la experiencia de usuario lo importante no es que la web vaya rápida sino que el cliente tenga una buena experiencia de usuario pues eso hará como entre la tasa de conversión no porque una web cargue más rápido vendenos más no porque una web cargue más rápido posicionará mejor pero muchos factores como son todos estos pues sí que no soya ¿cómo lo medimos? lo medimos normalmente o partimos del patch speed sign es un test de Google más que todo ¿por qué? porque normalmente cuando diseñamos página web, lo hacemos posicionamiento SEO nos pasamos en el botón de búsqueda por excelencia que es Google ¿no? y Google nos ofrece una herramienta en la que nos mide de alguna manera cómo está nuestra web en cuanto a rendimiento, se da velocidad, en cuanto a accesibilidad ¿vale? en cuanto a buenas prácticas que esto ya lo veremos es como maquetamos, como programamos ¿vale? y si está preparada para SEO, este puntuación de SEO es simplemente que es vuestra web estendexada tiene sus h1 no porque aquí te pongo un 100, pues ese es lo primero o sea esto es que vuestro código Google dice ¿vale? puedo leer que está preparado para posicionar ¿vale? hay otras herramientas como gtmetrics o Pindome, gtmetrics es la tuyeta Pindome y Pindome es el pago, tiene una versión de prueba pero de pago yo solo utilizar pues la de Google porque al final es la que me va a determinar más el posicionamiento de esa página web ¿Qué impacto tiene el VPO? pues claro si una web carga más rápido pues nos ayudará a vender mucho más ¿no? no lo mismo que tal un segundo que tal cinco ¿vale? en una web máximo lo ideal un segundo menos, eso es que lo ideal es cargar una web o sea es super rápido pero bueno podemos dar un baja en entre uno y dos segundos ¿vale? que tendríamos entre un 39 y un 34% más o menos de conversión ¿no? conforme ya vayamos bajando pues tenemos más menos conversión ¿no? un e-commerce, la gente en el e-commerce si que es verdad que los usuarios son un poquito más pacientes y podemos ampliar un poquito ese rango ¿no? pero siempre que nos bajemos de un segundo eso sería el tiempo ideal ¿vale? bueno dentro de nuestro proyecto pues hay una serie de figuras o roles ¿no? y yo querido representar tres figuras o tres roles no significa que estos tres roles intervengan en este proyecto pueden intervenir juntos o separados ¿no? para mí un rol que quizás sería un poco más básico sería alguien pues que es más un copyright alguien que se siente mucho en contenidos ¿no? gente de marketing ¿no? que tiene conocimientos básicos de código con lo que recurre rápidamente a herramientas de optimización porque no sabe cómo va a optimizar esa página ¿vale? web designer, maquetadores o gente que ya conoce un poquito más del código ya tienes un poco más de poder para decidir o cambiar si te está a una mala puntuación ¿vale? y luego tenemos los web developers que esto ya tiene mucho conocimiento de código pero también tienen que saber cómo optimizar ese código para que Google te dara buena puntuación con lo que los de abajo dependemos mucho más de los programadores que hacen módulos los del medio también yo me considero más un web designer y los developers, como se lo hacen ellos como yo os quiere el módulo pues tiene que saber todas las prácticas tiene que saber cómo implementar ese código ¿vale? Google Writer, bueno, nuestro proyecto pues necesitamos una serie de herramientas ¿no? y a la hora de optimizar tenemos que decidir un poco qué herramientas vamos a utilizar ¿no? si somos un desarrollador pues evidentemente nos lo vamos a hacer nosotros a lo mejor nos apoyamos en algún plugin que ya está hecho y lo modifican pero al final la optimización depende de él habrá muy poco código que en turbio o que en sucio ¿no? esa optimización ¿no? los copyright en concreto yo te diría que son esa gente que utiliza más podemos utilizar más constructores de bloques como es el de WordPress estos constructores pues bueno pues son lo que son ¿no? y se supone que los desarrolladores de WordPress ya han pensado en esa optimización con lo que nosotros nos evadimos completamente de pensamos una imagen, necesitamos siempre podemos tener alguna, bueno, un margen de mejora pero dependemos mucho de eso ¿vale? y los que hacemos constructores visuales vamos un poco a caballo entre hacerse la medida y utilizar pues Elemento, Divi en este caso para Builder o Oxygen ¿vale? esto ¿por qué? nos ofrece una gran, nos ofrece poder diseñar como queremos y también nos permite tener cierto control en el código que luego lo veremos que Builders nos permiten más y menos y nos permiten tener una optimización semintegrada pues que parte de los elementos que vamos utilizando ya están pensados para que optimicen ¿vale? se depende del constructor que utilicemos veremos que luego no y hay a veces que nos dejan y otra vez que no nos dejan implementar cierto código para que eso nos ayude a mejorar la puntuación bueno, cuando tenemos el equipo tenemos la equipolación, pues dice bueno, tenemos un proyecto ¿no? pero esto se basa normalmente pues en una idea hacemos un diseño de ese físico mental de ese proyecto lo plasmamos ¿no? y pensamos en ese lanzamiento ya está, hay una idea fantástica tiene un diseño fantástico y estamos a punto de lanzar ¿no? pues venga, este es nuestro proyecto es un proyecto que para nosotros es pues chulísimo ¿no? es un proyecto pues que tiene unos textos increíbles, porque o les he hecho yo o he contratado a un desarrollador ¿no? tiene unos efectos, vamos, increíbles porque o les he hecho yo, porque el constructor me permite hacer unos efectos en los que le meto parallax o le meto movimiento o le meto también, utilizamos unas imágenes impactantes utilizamos, le metemos una tienda online le metemos unos cuantos plugin que hacen mogollón de funciones ¿no? porque queremos que haga virgaría ¿no? nuestra web ¿no? le damos un convoyar, incluso nos conectamos con un sistema externo ¿no? y sobre todo pues vigilamos que todo ese diseño global sea muy cuidado ¿no? y decimos va, es perfecto, ya está ya tenemos nuestro proyecto, ya podemos lanzarlo ¿no? ya que lo demos ah, se me olvidaba y tenemos el hosting Pepito Tope Barato ¿vale? que esto mucha gente no le da importancia a la contratación de este hosting ¿no? ya tenemos hosting nos falta algo ¿no? y nosotros el plugin de cache claro, si queremos que nuestra web haya rápida ¿qué hacemos? cogemos uno de los plugins de cache lo instalamos le damos a cuatro opciones y listo para el lanzamiento, ya podemos lanzar ¿no? pues justo cuando lanzamos nos damos cuenta de que habían factores que que no habíamos tenido en cuenta ya damos a tener problemas ¿y cuál es nuestro problema? que es lenta, no está bueno es increíble, mente lenta claro, aquí ¿qué nos dice Google? ostras, un 48, de hecho estamos suspechos tenemos que sacar más de un 50 o sea, hay más de un 90 con esto que quiero decir que el web o no es instalar un plugin no es de esperar al final y decir, ya lo tengo todo cojo, le meto el plugin de cache y esto irá rápido no, y luego veremos algunas cosas que falseamos Google, que mira, esto es un poco técnico pero es interesante saberlo Google, lo que tiene son las colores wallbitals lo que mira es que principalmente que nuestro contenido mayor se ha cargado en menos de dos segundos contenido mayor puede ser un texto enorme que tengamos en la web o una imagen enorme o lo que el considere porque ya a veces que no sabemos por qué, considera que una foto que ocupa 500K es un contenido enorme y no es así, pero bueno todas estas puntuaciones tomarlas un poco de un biza es ideal que tengamos la máxima puntuación posible pero no es determinante tiempo y interacción, cada vez que un usuario hace clic en algo no, cada vez que el usuario carga la web y puede hacer clic en algo eso tiene que ser instantáneo no puede ser que se esté cargando la web y que esperemos un segundo hasta que el cliente quiera abrir una galería o hacer algo, no, tiene que ser instantáneo y luego lo que mira es la estabilidad visual que esto es nada, es muy rápido que este cada vez que hacemos un menú hacemos algo que cambia ese aspecto de la web pues hace más grande una caja, más pequeña o lo que sea, eso tiene que ser hiper rápido entonces, debes que esté como hacer un segundos, ¿vale? lo que mira sobre todo es que mira Google pues que se cargue rápido velocidad usabilidad interacción con la página, al final lo que está mirando Google a nivel de rendimiento es que sea muy usable la página, sobre todo, no rápida sea muy usable, si es muy usable no podemos hacer muy rápido y si es muy rápida el final será usable un factor que cambiará a Google hasta ahora estaba el feed hasta ahora, ahora cambiará el INP que hasta ahora era tiempo de interacción hasta que alguien hacía un click en la pantalla y ahora no, ahora se carga hago click y espero que pase algo ese tiempo entre que se carga, haces click y pasa algo, lo llaman interaction to next pane la interacción que tiene hasta la siguiente vez que pinta algo en la pantalla esto de momento sí que sale, sí que sale indicado pero no es un factor de puntuación de momento hasta marzo de 2004 por lo que he visto en la documentación ¿vale? ¿vale? pues ahora tenemos una idea una idea más o menos de lo que es VPO, de lo que tenemos que de que significan los indicadores y vamos con el primer consejo ¿vale? ¿dónde empezamos un proyecto? ¿dónde empieza un proyecto? pues me voy a decir, bueno, pues por la idea evidentemente pero cuando lo tenemos en VPO ¿dónde empieza es? pues en mi casa en un hosting si nos demos un buen hosting podemos utilizar muy muy bien la web que nos irá rápido pero no tan rápido como si os fijáis, no estoy poniendo hosting conocidos como web empresa, sideground o los que suenan siempre Nicalia es una empresa aquí de Barcelona y los utilizo no por darle publicidad pero va muy bien, la verdad hosting compartidos WeTopy también son de Barcelona y la diferencia entre Nicalia o estos de aquí es que estos de aquí los de WeTopy tienen como si fueran servidores independientes y Nicalia también los tiene pero es más hosting tradicional una sí es bastante pondente y lo que tenemos que mirar ahora de un hosting sobre todo es si puede ser que esté alojado en España que no está alojado en Francia ya que nuestros visitantes están cerca eso hará que nuestra web cargue más rápido que tenga discos duros rápidos que la velocidad de transferencia no esté limitada que no nos encuentremos con más o 25 mbps que sea rápida que tengamos un certificado que tengan firewall, una capa de seguridad que nos bloquee esos ataques porque lo que harán esos ataques es ralentizar nuestra web que tenga cachet de servidor si puede ser que la hablaremos qué significa soporte php8 que el 8 ya no ya mismo muere pues el 1 o el 2 compresión gzip y lo que dice un hosting o WPS a ser posible si nuestro proyecto es muy muy grande y va a tener muchas visitas WPS o un servidor cloud si va a tener pocas visitas o es una web de mi negocio local que van a verlo pues menos de 500 personas al mes o menos con un hosting tenemos más que suficiente no necesitamos más carga otro factor que tenemos es el impacto de las imágenes y este me he detenido un poco porque es el más común que me encuentro al optimizar las webs y el que más perjudica el rendimiento de la web ya he apuntado que no sé si me exagera un poco pero sí que me encontré a veces hasta 20 puntos de diferencia entre optimizar la web bien las imágenes bien y optimizarlas mal subirme imágenes de un medio es lo primero que te dice google vital es que utilicemos imágenes de nueva generación y eso significa que antiguamente teníamos el jpg el png, el git para poner fotos ahora tenemos el web un formato creado por google y si es creado por google aparte de que ocupan mucho menos las imágenes pues todo lo que sea soy yo no lo dicen así pero seguramente posicionará mejor tenemos el avi mp4 mp4 se sigue utilizando pero si utilizamos el web m aún optimiza mucho más tenemos el vídeo que en mp4 tenemos el web m después tenemos vectores y vectores se puesto en guión porque antiguamente no sé si se puede poner vectores o no me suena no sé si hay un formato para meter vectores pero era un git o un jpg realmente no hay vectores ahora podemos utilizar su g que realmente pues utilizamos mucho más o los antiguos gif ahora solo lo tí no sé si se pronuncia así son gif es la sustitución del gif todo esto hace que en nuestra web pese menos cuanto menos pese más rápida irá optimiza las imágenes lo ideal si podemos hacer menos de 100k sería lo ideal de los ideales es una imagen de que a veces era que ocupan 2000k y nos vamos a 200k pero si puede ocupar menos de 100 mejor de hecho tenemos un proyecto con el casi todas las web ocupan hay 50, 60k de cabecera bueno, están muy optimizadas pero la web carga muy muy muy rápido no sólo el hecho de que pesen poco sino de ajustar su tamaño que cuando en una página web utilicemos una imagen que ocupa 500x600 pixels que la subamos por 500x600 pixels la subamos a 2000 y lo hagamos pequeña que sea el tamaño que realmente se va a ver ¿vale? utilizables y luats esto lo que significa es una carga preciosa lo que hace es que hasta que no se interactúa la web o sea la foto con la o sea no aparece la foto en la pantalla no se carga esa imagen es con lo que es en la página web tengo 20 fotos estas fotos están en espera hasta que llegan a su momento que se van cargando y eso hace que pintemos muy rápido que lo que pide google pintemos lo más antes posible de la web y que sea lo más antes posible interactiva que lo que quiere aquí os pondré un enlace que luego os compartiré he utilizado Imanchify os pongo web per converter porque es un conversor que utilizo yo mucho a nivel online para convertir web y el Tini PNG que también es un super conocido que también es un conversor online siempre que podáis no utilicéis plugins de conversión dentro de WordPress menos plugins mayor rendimiento con lo que si es un trabajo que podamos hacer fuera no lo hagamos dentro no carguemos a WordPress de un peso más de tener que optimizar las imágenes a su tamaño, a su peso adecuado y en su formato adecuado y en comprimidas al máximo y la subimos siempre que podamos utilizar SVG ahora os lo explicaré un tukito sobre el SVG aquí os hablo de os enseño WP Rocket porque es el plugin quizá más conocido por todos puede ser que sea el mejor o no a mí depende de que proyecto me ha ido muy bien, depende de que proyecto no me ha ido tan bien va muy bien unos o va muy bien otros o va muy bien ninguno entonces os explicaré esto porque es el más visual de ver las opciones a la hora de nosotros poder optimizar nuestro propio WordPress tenemos el lazyload cuidado con el lazyload si nuestro elemento DB o tema que estemos utilizando ya carga su lazyload por defecto aquí no lo podemos activar con lo que tenemos que tener cuidado de no activar dos lazyload hay costuctores visuales los nuevos sobre todo que ya dejan incluso activar por elemento independiente de ese lazyload y ya no a nivel general sino yo veo una imagen y le digo que quiero lazy o no quiero lazy y lo que te dice de más dimension es muy bien porque lo ideal es que nosotros le definamos siempre sabéis que en el html cuando ponemos ponemos img with8 el source pues muchas veces los elementos no nos ponen el ancho y el anto hay veces que no nos damos cuenta o el elemento que estamos utilizando ya sea de costuto visual o temblock o lo que sea nos permiten poner eso, nosotros no somos programadores entonces si marcamos esa opción este plugin te lo añade automáticamente porque te está modificando el código al vuelo todo lo que modifica el código al vuelo todo lo que podamos hacer nosotros antes mejor que no después aquí hablaba un poco de la optimización automática de las imágenes aquí existe el image file este yo he tenido bastantes problemas por eso le decía y esto es un tip que normalmente suelo poner que no se generen miniaturas y eso la genero yo, la que quiero porque si no empieza a optimizarte 10 versiones de la misma imagen eso te hace que te ocupen muchísimo el disco duro y bueno, nos pasó con una web que tenía 3.000 productos cada producto tiene 5 fotos cada 5 fotos tiene 20 miniaturas cada 20 miniaturas tiene 20 conversiones web p con lo que al final pues el content la carpeta de imagen ocupaba casi 20-80 días una barbaridad yo lo que hago es que no genera y le digo que no quiero que me genere o sea que me guarde ningún vaca y nada simplemente para liberar espacio la subo, claro lo ideal no es esto lo ideal es que nosotros ya la subamos directamente bien pero simplemente era un truco el doom es el doom el doom es si? el doom es el código muchas veces cuando hacemos el y la mayoría de veces que se queja google de que no está bien utilizada tu web es por un doom excesivo y te sale en rojo hay muchas líneas, muchas líneas que significa de nuestra página web si fuera programador pues cogería y diría y página de estilo y yo lo hago así porque no necesito nada más y yo sé que voy a sacar esto nos vamos a un constructor visual ostras, es lo mismo y necesitan un montón de código ¿por qué? porque estos constructores visuales ves, te dicen el doom side estos constructores visuales muchas, a lo veremos, no todos te meten pues muchas clases para que para que tu desde una parte visual puedas hacer vicarías, ponerle borde cada tuve eso tiene que tener cajitas y bordes y tal y no solo el hecho de eso que te va metiendo dip sobre dip y llega un momento que eso para hacerte un título y un párrafo te ha metido 5 dips no puede ser, tiene que haber un dip con un título, con un párrafo y ya está un truco de doom excesivo que os puedes pasar en svgs nos paso con un proyecto y es que estos iconos me saltó la alarma de que hay un doom excesivo no lo está marcando bien realmente es el icono el icono lo estamos metiendo como svg puro y al meterlo como svg puro, está metiendo todo el código y como este es el sello este imaginaros tiene que dibujar el vector el círculo, el otro círculo, el des... claro, hay que necesitar mucho código para generar esa imagen claro, si encima le metemos ese, le metemos la copa le metemos el otro y encima el agua y llega un momento que vemos muchos trozos de código enormes, ¿vale? ¿Qué podemos hacer para sucionar esto? nos meten mucho, mucho, mucho código, ¿vale? ¿Qué... solución sencilla hay? meterlo como una imagen y así le metemos una imagen, le metemos vspy, le llamamos con un svg y directamente ya no le metemos el código directamente y ya no se quejará de que tenemos doom excesivo ¿Lo hay ya en svgs? si, el fichero lo hemos metido en svg, ¿vale? el iconito no era un gif, no era un png era un svg no, no, no yo cojo y yo lo llamo en vez de llamarlo como si fiches arriba pone en el código pone svg, claro bueno, tal, tal, tal, tal, esto en tu en tu... no sé si tú quieres hacer elemento ¿lo utilizas elemento? vale, pues si te dices elemento te saldrá arriba un elemento que se llama svg, ¿no? y tú coges, lo pegas y entonces te pasarán de arriba a la imagen y llamas a svg no utilizas el elemento de svg, utilizas el elemento y entonces te genera el código de abajo y entonces eso hará que el doom te desaparezca bueno, es que veis de 50 líneas a una línea y subiendo el svg a la delería de la multimedia ahí lo trata con imagen si, tienes que habilitarlo, por defecto, creo que no viene los cututeles visuales suelen venir con una acción de habilitar la subida de svg y si no hay algún plugin creo que hay algún plugin que habilita la subida de svg, ¿sí? ¿vale? batalla de builders todos estos son acostumbrados a elemento, yo también, eh, llevo 5 años de que salio utilizando elemento, ¿no? yo vengo en un perfil un poco más técnico mis estudios son más técnicos, me gustaba mucho el diseño y me pasé al diseño, ¿vale? entonces, me gusta... no es que me guste el código pero lo entiendo entonces, al entenderlo, muchas veces me cabriaba con elemento lo que era fantástico cuando lo descubrí el eso de poder diseñar libremente lo que me diera la gana sin asegurar con los short cuts los díamos short cuts, todo el visual composer lo voy a hacer ahora era horrible diseñar con eso, ostras llega elemento, pues se te abre, bueno estaba TV, pero a mí me gustaba más elemento, ¿eh? a lo de diseñar, ¿eh? qué guay, pongo aquí, dibujo y tal y pico y tal, pero con el paso del tiempo y justamente este año me da cuenta que he perdido mucho de ese buen hacer de buenas prácticas que yo tenía la hora de maquitar y me he llevado a la la lujuria o no sé cómo llamarlo, ¿no? de, de, de decir, venga va, elemento aquí, elemento y elemento y elemento y cuando ves, digo, bueno, si va rápido, va rápido, va rápido hasta que me da cuenta de que mis web no iban rápido y yo, no, no puede ser no puede ser he visto webs a 100 con elemento, ¿eh? pero a veces la puntuación que te da de 100 no es totalmente real, tú pruebas luego la web y ves que yo al final lo que hago es coger el móvil y probarlo ¿vale? y si yo lo pruebo, va rápido pues mucho que me diga Google, que me da 89, me da 92, me da igual pero yo creo que vaya rápido, ¿vale? muchas veces pues me he encontrado con webs de 100, elemento con trampa, que ahora lo veremos con trampa, para hacer que eso te decían pero no es un 100 real estás engañando a Google, ¿no? Bricks y Oxygen, que había algunos Blitz Oxygen, ¿no? o habéis utilizado, ¿no? Oxygen, son constructores de nueva generación hechos por programadores pensados para diseñadores y para programadores con lo que yo diseñar con aquello es como si lo más parecido a diseñar con código, lo más parecido sin saber ese código, ¿vale? yo cojo esa sección de arriba y le digo que es un dip todas aquellas cajas que veis, es un dip todas estas cajas que veis son 20 o 30 dips es exagerado, veis el código y aquello no, aquello le digo quiero un dip, quiero otro dip y aquí voy a meter un cabezado y aquí voy a meter, y claro, tiene mucho control sobre el diseño, muchísimo pero quiero un nivel técnico mayor, más conocimiento de CSS, de HTML ahora luego lo veis, al final enseñaré comparativa de Builders, esto pues se está comparando así más o menos, ¿eh? editor de bloques Elementor, BitBuilder DbCm y Bacary que es el que menos me gusta pero bueno, he ido cogiendo algunos son reales, mío yo te he ido cogiendo pues datos de, pues que he visto de referencia o gente que ha dicho que mira me está dando esta puntuación y tal, ¿no? son de referencia, no son absolutos pero para acá es una idea, ¿no? un editor de bloques, si me necesitamos contando con el 20, este es mío, esto lo he hecho yo 1,1M ya tarda a encargar el tema HTTP request request lo que significa son llamadas que hago desde mi tema a otros archivos externos para hacer funciones, ¿vale? con lo que el editor de bloques tiene 14 Elementor 34 o sea, llama 34 archivos para montar algo que a lo mejor la mitad no lo necesita Brick Builder llama 6 Divitem llama 23 y Vivekavaki a 36 ¿vale? el tema que utiliza Bricks es un tema de por si, no es un plugin entonces, al ser un tema de por si como Divi es mucho más ligero, pero lo han optimizado mucho más he contado, bueno, Astra con el Vive Bacary y Elementor con el Hellucim es el tema más básico de los básicos para Elementor, ¿vale? Yo se utilizo siempre porque al final es el que te da, pero aún así te mete código CSS, te mete una serie de clases que no necesitas y no sabes ni cómo eliminar, la idea de esta última versión en Elementor la última ha ensancado ya una acción para decir, no quiero tus clases, quiero las vias ¿vale? bueno, con esto, ¿qué quiero decir? que a la hora de seleccionar nuestras herramientas sepamos con qué estamos trabajando y lo que nosotros vamos a tener porque si sabemos que tenemos una herramienta lenta por mucho que queramos subir a 100 nos va a ser imposible si lo queremos hacer a mano, nosotros somos programadores pero si tenemos la limitación de que no sabemos todos los conceptos técnicos también tendremos limitaciones ¿no? o sea, estos consejos se pueden aplicar también a todos los perfiles ¿vale? entonces, sobre todo, pues en Elementor tiene muchas veces lo de activar el Doom mejorar el Doom ¿vale? utilizar Blocks, utilizar Flex igualmente en Elementor, o en otros costitutores no lo sé, pero al menos en Elementor te hacía su contenedor con su caja, su columna, utilizaba mucho la estructura de bootstrap por columnas, ¿no? y esto ha pasado un poco la historia y ahora es más Flex ¿vale? entonces, siempre que tengamos esa opción iremos a Flex ¿vale? minimizar los contenedores siempre que maquetemos e intentemos utilizar los menos cajas posibles ya sé que, ya sé porque tenemos si no sé un editor de Blocks, poca cosa vamos a hacer porque eso podemos arreglar un Blocks y esperaremos que eso no tenga muchos Dips si utilizamos un o la hacemos a medida, pues nosotros somos libres de hacer todas las tuturas que queramos, pero si utilizamos un Builder, pues saber que Divi, Elementor o Bacary nos va a meter bastantes Dips como hemos visto antes, ¿vale? y bueno, minimizar el uso de los elementos, a veces abusamos de decir, pues esto con una galería que no, pues si vamos a meter un título, no le metamos un icono y a veces lo que hago es meter un icono suelto y un título al lado, no utilizo el elemento icono porque sé que el elemento icono me mete mucho código, entonces no lo utilizo, cojo el icono y cojo un título y lo meto dentro de una caja y me la monto yo pero no me la monte Elementor, por lo que así reduzco, es que es lo único que puedo hacer con elementos, es decir, en algo que mande yo ¿no? y que utilizemos y a ser posible que esto lo que he dicho antes que perdí un poco las buenas prácticas de utilizar clases TSS, abusaba del lápiz que hay en Elementor, o sea, siempre llegamos y lápiz, color lápiz, borde, lápiz letra, lápiz y lápiz, lápiz, y ves que está toñando lápiz, llega a tu cliente, mañana te dice quiero cambiar todos esos colores ostras, venga allí a dar al lápiz toda la mañana, a todas las páginas donde dar al lápiz no, esto estaría bien al que aprenderéis un poco de TSS y crear una clase, y crear de fuentes globales correo de globales y aplicar clases a elementos que son comunes o que así primero agarrará tiempo a la hora de hacer cambio y optimizaréis mucho el código cada vez que le des al lápiz genera una línea de TSS si yo creo una clase genera una línea para todo si le doy 50 veces al lápiz son 50 líneas, ¿vale? todo esto aumenta al DOOM tipografías también es un aspecto importante dentro del del rendimiento web no solo el tipo que lo hacemos por ser más bonita, más fea sino el número de tipos el número de tamaños el formato si podemos elegir un solotipo de letra, mejor que dos porque la mayoría, sobre todo si viene el diseñado te dirá no, no, títulos de una manera cuerpo de otra y si puede ser destacado de otro título no, no, si podemos utilizar el mismo mejor, porque llamamos a un archivo no llamamos a 20 archivos si encima le decimos un grosor, mejor 2 que 4 mejor que 6, ¿por qué? porque estamos llamando cada grosor tiene su propio archivo y estará veremos cómo se puede solucionar uso de fuentes variables ahora lo veremos, que esto es una solución no tener que necesitar tantos archivos formatos comprimidos WAV 2 tenemos TTF tenemos otros formatos de fuentes WAV 2, que es lo que haces comprimir que ocupa en menos, ¿vale? alojar los archivos en el servidor, eso es que no utilizar Google Fonts aunque la fuente de Google, o sea de Google Fonts pero la descargamos, la subimos nosotros no hacemos una llamada a Google Fonts, que nos valdría eh, nos valdría como conexión externa para que viniera mejor pero el problema de Google Fonts, que la punto aquí es que la privacidad de Google Fonts se guarda en la IP y entonces no es legal que se guarde en la IP, entonces ¿qué hacemos? alojamos nuestra fuente dentro de la web, ¿vale? y precargamos las fuentes, esto que significa que yo en el plugin, a lo veremos en el plugin de Cache podemos marcar una opción donde hemos guardado esa fuente, entonces cuando carga la página le dices, eh, que mi fuente está aquí no me hayas buscando, te la precargo para que cuando te enseñe la página ya se enseñe con su tipo, que no sería de una manera, no sé a veces ha pasado ¿no? que se ve una fuente y luego se cambia otra ¿no? pues esto lo que hace es intentar agilizar ese proceso, ¿vale? aquí lo que veis, los tipos de fuente que podemos utilizar y podemos poner en la página T, es que estamos utilizando el 300, el 400, el 600, el 800 y el 900 porque queremos utilizar un montón de grosores porque queremos que hacer supechula nuestra web, ¿vale? ¿qué solucionáis? a ver si se carga Variable Fonts esto es un solo archivo que nos permite diferentes grosores y diferentes anchos, ¿vale? de fuente solo con un archivo, no con 20 archivos, ¿vale? esto en Google Fonts encontraréis un sitio que pone Variable Fonts, cuando entraes hay un sitio que pone Variable Fonts y podéis seleccionar las fuentes que son variables pues esto, ¿vale? bueno, tipo de fuentes ¿qué tenemos? pues tenemos TTF, tenemos bueno, hice una comparativa y lo medí esto sí que lo calculé yo y cogí una fuente y midí cuantos 9 archivos que ocuparan de diferentes tipos pues tu ocupan unos 500K esto lo puse en un móvil 3G y ahora 5G luego la carga es en un móvil moderno no se le atacan pero si tenemos poca cobertura así que se va a notar, entonces la diferencia de carga es que aquí hacemos request, o sea, llamamos a 9 archivos y tardamos 1,3 segundos encargar 9 fuentes, 1,3 segundos hemos dicho que la web solo puede tardar menos de un segundo si ya lo ideal, con lo que ya nos estamos pasando ¿no? Variable, si esto cogemos y la pasamos a TTF lo mil cogemos una variable TTF que son las que te vienen de Google, te va a ocupar 100K que dices, bueno, ostras, 5 veces menos y a me tarda 0,25, dice ya, pero si encima lo paso por un conversor, que hay conversores online, que te los pasan a web 2 pues te ocupa 51K o sea, estamos hablando que 100 veces menos vamos a, y te tardar a 0 como algo o sea, es instantáneo, de estar un segundo esperando, un segundo y medio va a ser carga instantánea claro, pero todo esto es trabajo que tenemos que hacer antes o cuando ya tenemos el proyecto montado o sea, tenemos que prever que todo esto, lo tenemos que preparar antes, ¿vale? pero, la base de datos la base de datos, pues también es el gran olvidado, quizás pues es una parte más técnica, pero muchas veces cuando acabamos un proyecto sobre todo cuando acabas el proyecto hacemos una pequeña revisión suelo pasar, he puesto este lo de OPDMIs que este es quizás de lo más conocido de la optimización, ¿vale? aunque la mayoría de plugins de caché, de superroque de Litespeed caché, que lo hablábamos ya tienen una acción para limpiar pero si no la tenéis, no tenéis estos pues tenéis este que es gratuito y os permite sobre todo cuando estáis trabajando en el proyecto empecéis a guardar muchas revisiones de ese proyecto y me he encontrado el proyecto que cuando acabas tienes 5000 revisiones son 5000 líneas en tu base de datos, que no siguen para nada entonces claro no es que sea un factor fundamental pero cuanto más ligera sea la base de datos pues mejor, ¿vale? con este plugin nos permite eso quitar comentarios, quitar, hacer un poco de limpieza para que la base de datos ocupe menos ¿vale? este el Core monitor es un plugin que nos permite saber o detectar posibles errores ¿bien? nos permite conectar algunos errores que pueda estar generando nuestros plugins que tenemos instalados porque aquí ya llega un momento que ya no es la maquitación, ya puede ser algún plugin que no, yo lo sé, me necesitaran plugins de correos me necesitaran plugins de de lo que sea, ¿no? y esté generando un error también nos da, nos puede dar pista de si realmente ese plugin lo necesitamos o no porque si no necesitamos, a lo mejor lo estamos poniendo yo lo que sé, me invento, ¿eh? el Jetpack, es un plugin que yo personalmente lo desestalo rápido porque me encontré con muchos problemas a la hora de rendimiento y la gente me dice, no, me da muy bien por la estadística me da muy bien porque tengo que contratar la seguridad bueno, si te va bien y es necesario, lo dejamos pero si es por la estadística, tenemos el Google no necesitamos Jetpack entonces, un plugin menos yo soy partidario de llegar y todos los plugins que hay, ya que no hayan falta fuera, en el cargo, ¿vale? esto te puede ayudar a dar pista, ¿vale? de cuántas consultas se están haciendo por ejemplo cuando están maquetando con Elementor plugin, Jetengine, Googleblock no habéis utilizado nada, bueno, lo explico Cache bueno, aquí vamos un poco a lo que es el plugin de Cache, que significa la Cache ¿no? la Cache lo que significa es que generamos una copia simplificada, no de esta página web ¿no? tenemos unos archivos brutos que son dinámicos, que normalmente pues cuando aparece la página web pues tenemos un catálogo en la que salen todos zapatos que tenemos a la venta cada vez que se carga la página, si no tenemos Cache tiene que consultar a la base de datos, todos esos si tenemos la página estática, significa que ha hecho una fotocopia de esto y te saca solo el código HTML limpio sin ninguna consulta HTML ¿vale? PHP, ¿vale? que sí que saca alguna, pero me puedes no cacher algunas consultas, ¿eh? pero también te saca aún de esto y puedes y puedes cargar en una página que tala en tres segundos cargala en un segundo, ya no va bien ya no va bien, ya estamos dentro de tiempo ¿vale? esto es lo que significa la Cache ¿vale? pero tenemos muchas Caches no sólo tenemos la del plugin tenemos nuestra Cache de navegador que muchas veces no llaman clientes no se ve bien la web, elimina tu Cache de tu navegador o no se ve bien porque estoy modificando algo, no veo algo elimina la Cache de de tu plugin, te tienes que ir hacia la Cache existe una Cache de página que normalmente está en el servidor y eso le he utilizado por Apache o Engix no son los servidores de web que son los que sirven la página web ¿no? vamos a utilizar plugins como Lightspeed Cache hay varios ¿no? pero si son de servidor, lo bueno en Lightspeed Cache es que esas fotocopias no se te almacenan en tu Wordpress se te almacenan en el servidor ese es el servidor que se encarga de hacer esa fotocopia no tu Wordpress, coloque liberas tensión a Wordpress si elegimos un hosting que tiene Lightspeed Cache o un sistema de Cache propio no tiene por qué ser Lightspeed pues liberamos a Wordpress de pesadez ¿no? luego tenemos la Cache de objetos que eso se activa con el PHP normalmente ¿no? en Apache y hay un plan de pago, el Redis normalmente suele ser de pago que esto lo que, esto patina muy bestias muy grandes, muy grandes, muy grandes que requieran hacer un gran volumen de datos pues si lo que hace es como cachear esas consultas para que no tengas que estar consultando siempre ¿no? y nada, y luego tenemos que no lo he puesto como cache y luego la tecnología que utilicemos de base de datos ¿vale? Maya SQL o MariaDB no voy a decir cuál es mejor o no pero sí que es verdad que a veces influye bastante que tecnología utilicemos ¿vale? ¿que nos permite los plugins de Cache? bueno pues que son fácil de configurar llegamos y tienen un montón de opciones y las marcamos todas o lo que nos dejen marcar ¿no? y ya está ¿no? que no mejora la carga, podemos utilizar el htd el código que tiene, la base de datos las imágenes ¿no? incluso lo puedes entregar con cdn que luego hablaremos que es ¿no? ¿que es mejor cache de servidor o plugin? es lo que he hablado antes para mí es mejor cache de servidor porque almacenamos las páginas en el servidor no en un plugin que te genera esa copia y la almacena dentro de tenemos diferentes plugins como el Optimize también hace cache, el Total Cache que es muy conocido, el Super Cache que es automático el UPPer Rocket, yo lo que te hizo en March lo total bajo UPPer Rocket o Lightest Cache ¿vale? depende del servidor, si estoy en un Lightest Cache Lightest Cache, si no estoy UPPer Rocket Cache, esta es la opción que tenemos de Cache yo siempre marco el habilitar sobre todo si utilizáis el Elementor activar la opción de guardarse paradamente los archivos para dispositivos móviles porque te genera, en un momento de Elementor los computadores visuales te suelen generar CSS diferentes y entonces guardamos la misma copia para el escritorio que hay a veces que ocultamos con el desktop, que no es una buena práctica ocultar por CSS, si no sería por código, no mostrar el elemento pero bueno, a veces no lo hace bueno, pues te permitiría no mostrar ningún elemento y te guarda páginas en caches diferentes eso hace que el engobillo vaya mejor vayan más rápido yo suelo habilitar la de caches de usuario pero, ¿por qué? porque normalmente mucha gente a veces me dice no, es que me va un poco lento, sí, te va lento me va fantásticamente bien ahora la web, claro, porque yo se lo guéan, lo ven entonces que le digo, cada vez que cambies algo elimina, simplemente lo hago por eso porque no me estoy llamando exactamente de que va lento lo que es suyo, no activarla evidentemente si está bien esto, no lo actives y la vida útil de Cache la suelo poner a cero pero a cero, ¿por qué? porque yo decido cuando quiero renovar la Cache no sé que hay algún plugin que tenga un crón o que tenga alguna tarea programada que necesite de un refresco cada ciertas horas entonces lo pongo pero si no, ¿por qué se tiene que caducar la Cache? o sea, ¿por qué tengo que perder esas fotocopias si yo no he cambiado nada? ¿por qué se tiene que generar otra vez? ¿vale? eso es lo que se llama, que no sé si viene ahora o no precarga nosotros tenemos la Cache y hacemos una precarga de la Cache ¿eso qué significa? que haciamos la precarga, venga la precarga es 500 páginas 500 personas a la vez accedan a tu web ¿no? este plugin web rocker no tiene ninguna opción para decirle no precargues mi página a la vez, 50 veces, sino hazlo en lotes de 5.5.5.5 y espérate para qué, para no saturar ese servidor me ha pasado con proyectos de 3.000 productos que se cae al servidor le activa la precarga y era 3.000 personas accediendo a la vez no, no puede ser la precarga es que no porque veamos checks que marcar, sea todo fantástico y maravilloso hay que marcarlo todo haces una precarga en las nuevas versiones, ya no hace falta indicar el mapa del sitio ya te lo coges solo, si utilizamos Yoaceo o Ragnar y está la precarga de enlaces a veces lo que hago es no aplicar la precarga y esila de enlaces, a veces depende si la web es pequeña, activarlo todo si la web es mediana de cada enlace, si es muy grande no es marco nada no es marco nada porque se cae la precarga de enlaces significa que cada vez cuando pasa el ratón por encima se precargue, entonces te da la sensación de que esa web ya está cacheada y te la enseña ya cacheada ¿Qué pasa con la cache? que la primera persona que hace la va a ver lenta la siguiente ya la va a ver bien con la precarga lo que estamos haciendo es que no hayan un primero, nosotros somos el primero y hace pooooooo entonces generamos todas esas fotocopias para que el que venga el primero ya lo vea que va rápido podemos lo que he explicado antes tenemos la precarga de fonts, lo que he dicho antes le metemos aquí la línea le decimos que quedemos esta fuente y cargamos esa fuente y la entrada de enlaces aquí podemos cargar como script externos podemos cargar direcciones que tengamos contenido externo script o algo externo lo podemos cargar ahí y hace como una precarga hace que se cargue mucho más rápido si lo tenemos todo precargado no sejo purgar esta url o sea no vayamos a cada vez que modificamos todo eliminarlo todo porque si tenemos 3000 productos y cada vez que modificamos la ficha, yo que sé, la página de nosotros y no es la ficha de producto pues no, solo borramos la de nosotros no borremos todas si es un algo que afecta a nivel global de la web, entonces si, programos todo minificación de archivos eso que significa que bueno, nuestro viaje espacial podemos comprimir nuestro equipaje para que pese menos y podamos ir más rápido lo que hace es que si os fijáis, el código de arriba y el código de abajo es el mismo uno tiene un montón de espacios y el de abajo no tiene espacios lo que hace cuando marcáis, el minificar css y js, lo que está haciendo es quitar todos los equipajes, bueno, perdón, todo junto en una línea, entonces aparentemente estamos arrando casa que tampoco es una panacea, pero google te valora que tú hayas hecho un más pequeño ese js ¿vale? ah, vale si, ves, aquí en the rocket lo que te ponía es esto, minificar css y minificar archivo js, hay una opción que pone combinar los archivos javascript te dicen que si tú servidor ya está sirviendo en http2 que es un nuevo protocolo, bueno hasta el 3 pero no hay tanta gente que lleva el 3, creo pero hasta el 2, pues no hace falta marcar esto, ya no minifica automáticamente tu propio servidor, ya no hace falta que, o sea, que minifica, que combine lo que haces juntarte todos los archivos en uno, o él decide cual tiene que, y normalmente si activas esto muchas veces se estropea la web ves que algo falla, entonces en mejor yo en mi caso en mejor no marcarlo, ¿vale? por defecto no marcarlo, ¿vale? y, o puedes tener conflicto entre plugins, ¿vale? ¿vale? muchas veces sale el problema este del elemento que lo bloquea en el renderizado y eso sale muchas veces y toca bastante la analiza que te dice que hay algo en el elemento que está bloqueando el renderidad, está bloqueando el que se pinte bien esa pantalla tarda mucho en pintarse, ¿vale? entonces lo que podemos utilizar es el remote eliminarlo, el cses no utilizado ¿vale? o la carga sincrona, ¿vale? antiguamente se hacía la sincrona, ahora google te aconseja que cuando cargues una página, pero esto pasa ¿qué utiliza? elemento o algún constructor visual, si tú lo te lo haces a medida, ya sabes tú que código tienes que cargar, ¿vale? pero en este caso como no tenemos ese control tenemos que decirle rastreame mi página y dime qué cses aquí no hace falta y entonces en cada página sirve sólo el cses que hace falta, menos cses menos peso más rápido, ¿vale? carga diferida ¿vale? que no es lo mismo que minificar, ¿vale? esto qué significa pues que tenemos código, ya la skip es un código que ejecuta animaciones o ejecuta interacciones con la página que normalmente no es necesario a la primera, entonces podemos marcarle y decirle que retrasa su ejecución hasta que el usuario interactúe con ese elemento que vaya a utilizar, ¿vale? y podemos marcarle algunas excepciones, ¿vale? te lo pongo aquí, predizarle qué significa pues que me ha pasado, que dices carga después el JavaScript, se carga la web le das al botón de menú y eso no funciona, hasta que haces ¡Ay! ahora ha funcionado, ¿por qué? porque primero y muchas veces pasa que la primera vez que le das no funciona y la segunda vez que le das no funciona y es porque como ha retrasado el JavaScript hasta que no haces click no se activa el JavaScript con lo que no tiene la orden de abrir el menú entonces cuidado, priorizar la usabilidad por encima de que todo te dé una apuntación de 90, ¿vale? cdn content delivery network esto lo que significa es que podemos llamar o servir nuestro contenido en diferentes sitios mucho más rápido, ¿vale? hacemos como mini copias de nuestro proyecto, ¿vale? ¿Quién utiliza cdn o dónde puede enjojerlo? pues Jetpack tiene un cdn, Web Rocket cdn, Amazon y yo lo que aconsejo normalmente es CrewFlare porque es gratuito y aparte te mete una capa de seguridad y esto que te hace copiarte tu web y servítela en todos esos puntos del planeta con lo que no necesitas tener un servidor en cada uno de los puntos sino el que está en Brasil pues recibirá desde el punto más cercano el que está en China, pues desde el punto de Australia o que sea, ¿vale? entonces eso lo que haces es copiar tu web cachearla también, pues tiene un sistema de cache y un firewall de seguridad, que la verdad es que te ayuda a relajar tu servidor con lo que tampoco necesitas tener un servidor tan potente porque se lo está chupando todo CallFlare, ¿vale? ah, mira, ahí te lo pongo vale ¿Realmente es nuestro firewall lo que iba a explicar es justo lo que iba a explicar sí, no o sea, no, porque realmente no necesitas no necesitas servir páginas fuera con lo que con tu propio servidor sería suficiente lo que pasa es que te imaginate que tienes muchas visitas locales y tienes mucha carga a tu servidor, tienes muchos ataques aquí tenemos un firewall que te va a evitar ataques de 2 que es hace de fuerza bruta reventar tu web, no te va a reventar nunca tu servidor, va a reventar el de CallFlare con lo que es necesario o no consejable sí yo no lo pongo en todos los proyectos ese son pequeños, no los pongo son más grandes, sí que son consejables con lo que te he dicho tiene también la optimización de imágenes que va muy bien, o sea, no necesitamos un plugin para imágenes, pero lo que he dicho prefiero optimizar yo mi propia imagen no utilizar plugins externos o sea, que lo pongo y prescindibles si nuestra web os tiene un público internacional pues sí bueno, punto 10 ya acabamos carga condicional ya por último ya tenemos todo el proyecto las imágenes chulas ya tenemos todos los plugins que necesitamos hemos elegido el mejor build ya hemos maquetado y nos ha aplicado todos los consejos que nos ha dado Néstor y ya tenemos un súper proyecto pero nos damos cuenta que hay ciertos plugins por malas prácticas de los desarrolladores que me he encontrado por ejemplo, un plugin de correos que se cargaba en la home y un plugin de correos no lo necesito en la home no lo necesito en el carrito cuando me tengo que calcular el envío entonces, existen plugins para alegrar un poco lo que no han hecho mal los desarrolladores entonces, hay varios está el Asset está el plugin Organizer que es de una versión gratis plugin Lwader, Filter y el que utilizo yo más es el Perfmatter que también me ayuda a hacer minificación y todo depende de cómo a veces me instalo en el European Rocket y instalo directamente en el Perfmatter aquí lo único que hago es minificar cuatro cositas y veo si algún plugin me está tocando un poco el análisis pero tampoco es un plugin que utilizo demasiado pero sí que en algún proyecto que iba muy normal lo hemos tenido que hacer entonces, yo en cada página podría decidir si ese plugin es de backend o sea, si es un plugin que solo se va a utilizar en el escritorio, ¿para qué quiero que se cargue en el frontend? pues no hemos encontrado un plugin que dice, está más desarrollado o sea, no tendría que cargarse lo que hago, es decir, no te cargues en el frontend no te cargues en esta página, no te cargues cuando es un producto no te cargues, entonces aquí puedes controlar que esos plugins no se carguen y lo que podemos hacer es tener mayor alentimiento bueno las conclusiones que sacamos de todo esto pues que debemos optimizar al inicio debemos pensar que mientras que desarrollamos tenemos toda esta buena práctica eso se ha explicado, sobre todo optimizar al final, si es verdad que no es aspecto lo que vamos a hacer, como el cdn meter códigos condicionales a cargar condicional o meterlo en google tag manager si lo metemos en google tag manager lo metemos todo en google tag manager mejor solo hay un request que llama el google tag manager optimización continua no se acaba cuando publicamos sino que si sobre todo trabajamos para clientes o proyectos nuestros pues tenemos que estar mirándolo tomar como referencia que aumentar de 90 a 100 si te da 90, está bien no hace falta, te de 100 pero pasa que a nosotras a veces nos gusta llevando la medalla y dices, un 98 te lo he subido pero y sobre todo es priorizar la experiencia de usuario voy a poner 3 casos pláticos para que veáis un poco cuándo y por qué no se debe aplicarse tenemos un caso que está el elemento de lo que hace poco que dice un proyecto en el que después de haberlo hecho yo me daba un 35, se me ha pasado lo del primero está super chulo, no lo tenemos y me da un 35 de rendimiento y dices que he hecho mal me encontré pues que había más genes pues que no lo había optimizado bien o fuentes que no había cargado bien empecé a optimizarlo y conseguí hasta un 76 más no he conseguido y he parado ahí tampoco me he obsesionado con un 80 o un 90 porque veo que la web carga rápido aquí por ejemplo, y esto es en móvil en el ordenado me está dando un 98 yo pongo móvil porque móvil siempre es el que menos te da y es el que más cuesta subir hace tiempo, bueno hace un tiempo subir más de 50 era complicado según cómo era complicado ahora se consigue, no sé si han cambiado un poco los algoritmos y parece que no son tan restrictivos y cuesta menos este es un caso en el que hemos utilizado Elementor uvprocket y se ha optimizado con un plugin en este caso es el vprocket tenemos otro caso que me llegó que esto no lo he montado yo con un dv y en el que aún sigo trabajando llega hasta un 86 pero esto sí que quiero optimizar más este es un dv con un total caché y me bajaba el rendimiento con lo que dije volvemos al total caché porque yo lo que quiero es subir la nota pero no a toda costa qué pasa aquí que vemos 35, cambio la versión de PHP, me subo en 46 solo por cambiar la versión de PHP porque tiene una versión muy antigua y le cargo la carga diferida cargame después los elementos anda, teníamos una imagen aquí que ahora ya no aparece claro que va rápido si no te enseña la imagen claro se te puede dar unos 200 y google lo valora bien y te da un 86 y dices ya pero estás engañando huel, o sea realmente tú lo miras en el móvil no puedes ser que ahora es la pantalla y no veas ninguna imagen es claro, tengo que tirar para atrás lo que he hecho con ese plugin no me vale y en este caso me quedé ahí pero lo que quería enseñar porque no vale todo con aplicar y vamos a cargarlo después de que podemos tener problemas y por último tenemos un caso de pricksbuilder un proyecto en el que es bastante minimalista pero se ha trabajado el EPO y no tiene plugin de cache ninguno si tiene light speed no luego le he metido light speed y con el light speed me ha subido 98 en móvil y a 99 el de este, si no no tiene light speed no se lo he metido es que este lo quería enseñar porque como este me permite marcar muy bien qué código yo necesito pues es que está limpio que te lo marca llamas muy accesible este plugin es muy accesible bueno pues hasta aquí os dejaré nuestros enlaces en blog en warpestv creo que también se colocará el vídeo os dejo mi contacto y nada, muchas gracias a todos