El Lazy Load Killer con CSS (1 línea de código) 🤯

Поделиться
HTML-код
  • Опубликовано: 14 дек 2024

Комментарии • 67

  • @matiasa5480
    @matiasa5480 2 месяца назад +8

    buen contenido mudi, también vi el articulo que subiste a linkedin sobre performance y rendimiento web

  • @Pixertool1301
    @Pixertool1301 2 месяца назад +4

    Me ha gustado tus últimos videos hablando de propiedades antiguas y nuevas de CSS.

  • @roneiservargas
    @roneiservargas 2 месяца назад +28

    Yo lei en el titulo: "esta propiedad de css me tiene PAPEADO! 🤯"

  • @bobobo1673
    @bobobo1673 2 месяца назад +14

    Pero midu quién no te hace caso? Si eres un trozo de pan que explicas muy bien ❤

    • @midulive
      @midulive  2 месяца назад

      Jajajajaja gracias

  • @SonGoku-pc7jl
    @SonGoku-pc7jl 2 месяца назад

    muchas gracias Midu, te queremos! ;)

  • @juangramajo_dev
    @juangramajo_dev Месяц назад

    Lo de los Overrides es algo que no tiene precio. Es un trucazo!!! Gracias por tanto, perdón por tan poco.

  • @MarianitoRayser
    @MarianitoRayser 2 месяца назад

    excelente midu ! , ahora actualizando y agregando esta propiedad.

  • @andresep
    @andresep 2 месяца назад +1

    2:32 Me encanta el conocimiento técnicamente correcto de Midu. 🤣🤣🤣

  • @weengineers5999
    @weengineers5999 2 месяца назад

    Excelente veré como va con los nuevos proyectos

  • @jesusj9895
    @jesusj9895 2 месяца назад +3

    Excelente contenido tio, muy guay! me preguntase si podes compartir información sobre como mejorar , ventas y desventajas al ocuparlos en las pagínas, alternativas actuales... GRACIAS por compartir tus conocimientos!!! Saludos

    • @tklazz
      @tklazz 2 месяца назад

      @@jesusj9895 no uses , se come toda la ram, usa mejor una API o haz server side includes (SSI).

  • @gamuro6977
    @gamuro6977 2 месяца назад +1

    De paso lo de las fuentes, increible muchas gracias midu :)

  • @frambersilva
    @frambersilva 2 месяца назад +4

    Muy buenas, donde esta el enlace hacia el artículo para optimizar las fuentes?.

  • @JuanPabloEspinosaPiedad
    @JuanPabloEspinosaPiedad 2 месяца назад +1

    MIDU es el Wampiz

  • @enriqueaguilera342
    @enriqueaguilera342 2 месяца назад

    midu, hoy utilice esta propiedad css y esta tremenda, quien pensaría que con css se podría obtimizar algo 🤣,
    resulta ser que tenemos un cliente que quería importar productos de forma masiva, y quería que todos esos productos se rendericen en el dom antes de importarlos,
    este cliente tenía un csv con 10.000 productos y esto tardaba como 3 minutos en renderizar por completo en el dom y hacia que la pagina no responda,
    pero le agregue el content-visivility y el cambio fue brutal, ahora solo tarda 30 segundos y a medida que se va scrolleando se van renderizando los elementos y uno ni se da cuenta

  • @DavidRodriguez-uj4ls
    @DavidRodriguez-uj4ls 2 месяца назад

    Una DESVENTAJA IMPORTANTE a tener en cuenta del infinite scroll en términos de SEO es que, cuando el robot de Google indexa una página, solo considera el contenido HTML que está renderizado inicialmente. Todo el contenido que se carga dinámicamente mediante infinite scroll no estará disponible en esa primera indexación, lo que significa que Google no lo tendrá en cuenta para el posicionamiento.

  • @darkchronoss
    @darkchronoss 2 месяца назад

    12:10 ¡Aaaaaawwwwww... pobechito! XD

  • @ramirodiazbravo7846
    @ramirodiazbravo7846 2 месяца назад +1

    simeplemente excelente..

  • @jossueeleazartejedamorales3254
    @jossueeleazartejedamorales3254 Месяц назад

    luego de un scroll ya no me renderizaba los svgs que estaban dentro del elemento de la lista xd, siento q es un bug, pero muy interesante!

  • @CobaltStark
    @CobaltStark 2 месяца назад +9

    * {
    content-visibility: auto;
    } ?😂

    • @victoralvarez5952
      @victoralvarez5952 2 месяца назад +1

      También estaba pensando en lo mismo, pero por lo visto tendrá un coste de rendimiento (irónicamente)

  • @TyrellDev
    @TyrellDev 2 месяца назад

    Casos de uso: modales, dropdowns, footers, infinity scroll, containers que esten muy abajo

  • @maclaren33
    @maclaren33 2 месяца назад

    Haz Un video de 0 a Master en herramientas de desarrollo 🎉serias el primero en RUclips

  • @juliokof
    @juliokof 2 месяца назад

    Midu, estas propiedades de CSS y otras mas nuevas, dónde las encontramos ?

  • @marcogomez9819
    @marcogomez9819 2 месяца назад

    Una pregunta esto funciona como por ejemplo lo hace react-window o como react virtuoso? Justo tengo que renderizar un tabla con más de 1000 filas y esto podría ayudar al rendimiento

  • @AngelGonzalezGonzalez-sx6dl
    @AngelGonzalezGonzalez-sx6dl 2 месяца назад

    Me recuerda a una función que tiene astro qué renderiza el componente cuando lo ve el usuario.

  • @iSaan86
    @iSaan86 2 месяца назад

    Hola!!! Alguien me puede decir cuál es el artículo de las fuentes?? Me parece súper interesante pero no lo encuentro.. saludos

  • @snithfferx
    @snithfferx 2 месяца назад

    Esto no es igual que el atributo hidden?
    También, hay alguna forma de hacer cargas en chunks, digamos igual que como hace maincra, que te carga sólo cierta cantidad de blocks y cuando pasas de un limite se desactivan.

    • @midulive
      @midulive  2 месяца назад

      No, no es igual.

  • @johanmcena
    @johanmcena 2 месяца назад +1

    1 seg de diferencia se puede transformar en un dolor de cabeza a largo plazo al momento de manejar la data 😂😂😂😂😂

  • @piergox512
    @piergox512 2 месяца назад

    no me aparece la opcion enable local overrides

  • @dev_time
    @dev_time Месяц назад

    Woloo mention 😂

  • @AlbertoJoseMiguelVasquezTrujil
    @AlbertoJoseMiguelVasquezTrujil 2 месяца назад

    Esta interesante pero cuando veo wikis algunas de estas tienen esta propiedad y como le choca al momento de buscar cosas ahi o ver contendio de abajo rapido, para otro tipo de cosas la veo bien pero en caso de uso rapido, lo veo incluso molesto

  • @kmylodarkstar2253
    @kmylodarkstar2253 2 месяца назад

    modo quirks para IE8 🤣

  • @rodolfolopezp
    @rodolfolopezp 2 месяца назад

    Se puede usar con nextjs 14?

    • @MrMiguelitro83
      @MrMiguelitro83 2 месяца назад

      Que tendría que ver el lenguaje o framework con el que está hecha la web, con una propiedad css que maneja el navegador?

    • @kaim8929
      @kaim8929 2 месяца назад

      si

  • @_d4rkd34d_3
    @_d4rkd34d_3 2 месяца назад +1

    su su sus cribete

  • @estebanpiedrahita2666
    @estebanpiedrahita2666 2 месяца назад +1

    RIP lazy loading

    • @rubiusoficial
      @rubiusoficial 2 месяца назад +1

      Pero la petición al servidor se haría igual, solo serviría para el lado del cliente

  • @andyTS90
    @andyTS90 2 месяца назад +1

    Jajaja con esa intro menos el hp de explorer, ya desde hay todo el contenido tomo mucha mas importancia 😂😂

  • @idanielmatt
    @idanielmatt 2 месяца назад

    Primero

  • @bryancabelloortiz2164
    @bryancabelloortiz2164 2 месяца назад

    oli

  •  2 месяца назад

    no para mi eso no sirve esta muy bien y todo pero la verdad es que una consulta tan grande de tantos datos es mas costoso que una consulta muy grande no es lo mismo cargar 1 millón de datos a mil datos es mas económico y mas profesional partir las consultas hoy en día ya no existen webmaster como antes ahora todos estudian por separado y el que maneja el servidor no es el mismo que crea los aplicativos lo cual crea programadores que no toman encuentra la funcionalidad del código con respecto al uso de un servidor. si quieres reducir el tiempo de carga de una web solo tienes que crear funciones en el bakend para servir la información, ejemplo si usaras un icono de 48 x 48 no coloques una imagen mas grande entonces internamente baja la resolución de la imagen a servir al tamaño que necesitas de esa forma renderizando el contenido al tamaño requerido.

  • @MarcelBK201
    @MarcelBK201 2 месяца назад

    Último

    • @JohanGutierrez-JA
      @JohanGutierrez-JA 2 месяца назад +1

      Vengo del futuro para decirte que no fuiste el último, lo siento :c

  • @JoseGonzalezMoreno-q7l
    @JoseGonzalezMoreno-q7l 2 месяца назад

    Yo estoy esperando que un día llegues todo enfadado dando golpes a todo y con la cara desencajada sin sentido.

  • @elmoster1909
    @elmoster1909 2 месяца назад

    Yolo

  • @MauricioGonzalezPalahjunkie
    @MauricioGonzalezPalahjunkie 2 месяца назад

    Luego ya parece que nada más anda viendo que hace Teo para venir a traducirlo

    • @NimbleTron
      @NimbleTron 2 месяца назад +2

      Creo que es lo contrario, fíjate las fechas

    • @MauricioGonzalezPalahjunkie
      @MauricioGonzalezPalahjunkie 2 месяца назад

      @@NimbleTron Teo habló de esto desde antier. Checa tooodos los últimos videos de Teo contra los de Midu y Midu ya sólo es un google translate.

    • @rbenx_c
      @rbenx_c 2 месяца назад +1

      ​@@MauricioGonzalezPalahjunkie
      no entiendo, hay algún problema o que pasa? 🤔

    • @JohanGutierrez-JA
      @JohanGutierrez-JA 2 месяца назад +4

      @@MauricioGonzalezPalahjunkie no es de antier, siempre ha sido así, porque quieras o no theo también es un referente, el detalle es que no todos entienden el ingles, ni siquiera usando el Google translate, les falta contexto. Pero las similitudes no es porque se copien entre si, si no porque hablan de las mismas tendencias que nos interesan, es como que si por ver una noticia de tu ciudad local luego la veas en una web u otro periódico y digas que ya está repetida, se trata de la actualidad y lo que está pasando, y cada quien le pone de su cosecha y su punto de vista, si no te gusta el de midu la puerta es ancha xD, Bendiciones

    • @Inbydev
      @Inbydev 2 месяца назад

      @@JohanGutierrez-JA concuerdo perfectamente sisi

  • @constructorasegnen
    @constructorasegnen 2 месяца назад +3

    Yo no se porque ustedes le dan tanta importancia a los demás navegador que no sea Chrome yo por lo mucho Safari le doy soporte y es porque es casi obligatorio porque hasta ahora es el navegador oficial de la marca de pues no me importa que usen Chrome todos el mundo y se dejen de loquera

    • @hayvervargas3671
      @hayvervargas3671 2 месяца назад +14

      Por qué de seguro no has tenido app o páginas web internacionales o de mucho tráfico.
      Ahí si ves usuarios de todos los navegadores

    • @constructorasegnen
      @constructorasegnen 2 месяца назад

      @@hayvervargas3671 si tengo y según ni datos de Google analytics chrome es lo que más se usa

    • @KevinRivas-sz3us
      @KevinRivas-sz3us 2 месяца назад

      @@hayvervargas3671creo que hace un poco de referencia a que porque la gente anda buscando tanto navegadores cuando todos van a trackearte y vender tus datos, entonces no tiene sentido usar más navegadores sobre todo porque pensas que por usar Brave no te van a trackear pero sin embargo entras a Facebook o RUclips que lo hara no importa que en que navegador estes, asi que no tiene ningún sentido

    • @JorgeAndres-es5oc
      @JorgeAndres-es5oc 2 месяца назад

      Y seguro tus usuarios tampoco usan productos apple..

    • @constructorasegnen
      @constructorasegnen 2 месяца назад

      @@JorgeAndres-es5oc dije que apena Safari