Angular 17 New Feature: Deferrable Views and Deferred Loading in Templates

แชร์
ฝัง
  • เผยแพร่เมื่อ 3 พ.ย. 2024

ความคิดเห็น • 83

  • @codeconcept
    @codeconcept 10 หลายเดือนก่อน +2

    Awesome editing. Makes all options super clear! Thanks Igor :)

    • @theigorsedov
      @theigorsedov  10 หลายเดือนก่อน

      Thanks a lot for the feedback! 👍 I'm glad you liked the video and found it helpful in understanding the new Angular features. Keeping things clear and focused is my goal. 🧠 Happy coding! 👨‍💻

  • @darkysharky
    @darkysharky ปีที่แล้ว +11

    Really nice video editing! Explains all of it pretty well!

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว +2

      Thanks for watching! 👍 Thank you so much for your kind words! I'm glad you enjoyed the video editing. 🎥 I put a lot of time and effort into it, so it means a lot to me to hear that you liked it. I'm working on some new Angular 17 videos now, so stay tuned! 🔜

  • @LovingLego
    @LovingLego 5 หลายเดือนก่อน +1

    I'm sticking with Angular 16 for my current project, but this video is really impressive.

    • @theigorsedov
      @theigorsedov  5 หลายเดือนก่อน

      I'm glad you liked it!👍 On my channel, you'll find other videos about new Angular features, as well as an excellent tutorial about Angular Signals (duration: 20 minutes). Stay tuned for more Angular content coming soon!

  • @fernando_her85
    @fernando_her85 11 หลายเดือนก่อน +1

    I must say, this video is just perfect! Thank you for sharing it!

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      I'm glad to hear that you found the video perfect! 👍 I see you have a lot of experience in educational programming videos and courses. Thanks for taking the time to share your thoughts. Your comment is really important to me. Stay tuned for more videos.

  • @Matrium0
    @Matrium0 10 หลายเดือนก่อน +1

    Wow great video and exceptional editing, thank you! Subscribed :)

    • @theigorsedov
      @theigorsedov  10 หลายเดือนก่อน

      Thank you so much for your kind words. 👍 I'm glad to hear that you enjoyed the video. I appreciate your time in sharing your thoughts and am grateful for your subscription! 🤝♥️ Stay tuned for the upcoming video about Angular Signals - I think you'll find it exciting!

  • @pandukumargujja2121
    @pandukumargujja2121 5 หลายเดือนก่อน +1

    Wow, superb explanation! I easily understood everything after watching this video. I don't know how you edited it or how much time you spent, but I really appreciate it, man. Keep up the great work!

    • @theigorsedov
      @theigorsedov  5 หลายเดือนก่อน

      Thank you so much for your kind words!👍 I'm glad to hear that you found the explanation helpful and easy to understand. Your appreciation means a lot to me! I put a lot of effort into creating this video to ensure clarity, so it's wonderful to know that it's paying off. Stay tuned for more! 😊

  • @VishalTheK
    @VishalTheK 5 หลายเดือนก่อน +1

    Many things have changed in Angular 17,18... need to break to grasp these and start using these in new projects.

    • @theigorsedov
      @theigorsedov  5 หลายเดือนก่อน

      You're right, there have been many changes in Angular 17 and 18, as well as Angular 16, which introduced important features like Signals and Hydration. I haven't covered all the updates from the past six months yet, but there will be several videos on my channel this month, including one about zoneless change detection.👨‍💻

  • @sntoshah
    @sntoshah ปีที่แล้ว +1

    awesome video

  • @codeme8016
    @codeme8016 3 หลายเดือนก่อน

    THE BEST VIDEO tutorial I've seen for years so far. The video editing made it so clear and understandable. Couldn't be better.
    Thank you so much for the effort!

    • @theigorsedov
      @theigorsedov  3 หลายเดือนก่อน

      Thank you so much for your amazing feedback!👍 I'm glad to hear that you liked my video and that the video editing helps to better and more easily understand the topic. I appreciate your support! There are also other videos on my channel about new Angular features.🚀 Stay tuned for more content!

    • @codeme8016
      @codeme8016 3 หลายเดือนก่อน

      @@theigorsedov Subscribed

    • @theigorsedov
      @theigorsedov  3 หลายเดือนก่อน

      Thank you for subscribing! Your support means a lot and helps the channel grow.🚀 With your support, I can continue to release new videos more frequently.👨‍💻

  • @harutyunmnatsakanyan2514
    @harutyunmnatsakanyan2514 ปีที่แล้ว +1

    Thanks Igor.

  • @ltd_music
    @ltd_music ปีที่แล้ว +3

    That's the most complete tutorial i've seen regarding Angular 17 use cases. Great work! Got a new subscriber!

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว

      Thanks so much for your kind words!👍 I'm really glad you found my Angular 17 tutorial helpful. I appreciate you taking the time to watch this and leave a comment.✍️
      🆕 A new Angular video is coming to the channel in the coming days! Stay tuned for more useful content.
      Also, thanks for subscribing to my channel! Your subscription helps me create more useful content.👨‍💻

  • @softwaredevx
    @softwaredevx 11 หลายเดือนก่อน +2

    Explained really well in detail. Thank you so much :)

    • @theigorsedov
      @theigorsedov  10 หลายเดือนก่อน +1

      Thank you so much for your positive feedback! 👍 I'm glad my video was helpful for you. Your support is greatly appreciated! 😊 If you haven't already, consider subscribing to the channel for more updates and future tutorials. ✔️ I appreciate your support and look forward to sharing more content with you in the future. Happy coding! 👨‍💻

  • @KostasOreopoulos
    @KostasOreopoulos 11 หลายเดือนก่อน +9

    Exceptional work. The video editing is amazing and I cannot imagine how much time has been invested to generate those animations. Are you using something like motion canvas?

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน +1

      Thanks for watching and for taking the time to leave a thoughtful comment! 👍 I'm glad you found it exceptional! Crafting these videos does involve a meticulous process with a keen focus on even the smallest details. Your appreciation means a lot, and it's fantastic to know that the effort invested is being recognized. 🙂
      I don’t use Motion canvas or similar solutions, although I considered using them. However, it won’t be possible to replace existing solutions due to insufficient functionality in the visual component. 👨‍💻
      I use the usual graphics apps, from Photoshop to Final Cut, including some small applications for some specific tasks. I’m trying to increase the speed of video creation, although I would like to see automation of the process in these apps at a higher level.
      I'm almost finished with a video about Angular Signals and another one explaining how both lazy and defer loading work in Angular 17. 🔜

  • @austinZen8800
    @austinZen8800 11 หลายเดือนก่อน +1

    nice work my friend!

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      Thank you so much! 👍 I'm glad you liked it!

  • @shilpasyal55
    @shilpasyal55 11 หลายเดือนก่อน +1

    great explanation

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      Thank you! 👍

  • @sfspmusic
    @sfspmusic 11 หลายเดือนก่อน +1

    Игорь, первый раз вижу, чтобы в IT ролике так парились с анимацией, спасибо за труд, получается действительно очень наглядно!

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      Спасибо за отличную оценку 👍 Как раз идея в улучшении качества объяснений с помощью визуальных методов для облегчения понимания и уменьшения времени, необходимого на изучение нового. А также чтобы просто приятно было смотреть 🙂 Использование визуального подхода позволяет объяснять задействуя те части мозга, которые быстрее и качественнее усваивают информацию, особенно, новую и сложную. 🧠
      В большей степени это заметно на сложных темах, например, различные абстрактные концепции (например, в Shorts есть объяснение что-то такое функция из моего JavaScript Tutorial).

  • @patrickkabuga4945
    @patrickkabuga4945 6 หลายเดือนก่อน +1

    Really great video, thanks!

    • @theigorsedov
      @theigorsedov  6 หลายเดือนก่อน

      Thanks so much for watching and for the positive feedback!👍 Your feedback really matters to me. In addition to this video, I have a couple of others about Angular on the channel, plus exciting new content coming soon about general Angular and the new Angular 18!🅰️ Stay tuned!

  • @CaptainCsaba
    @CaptainCsaba ปีที่แล้ว +2

    Great video man! Looking forward for more.

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว

      Thanks so much for the kind words!👍 I'm glad you liked the video.
      I'm excited to announce that I'm working on a new video about Angular right now, and it will be released soon.🔜
      Stay tuned for more Angular videos!

  • @F.C.Poet_
    @F.C.Poet_ 11 หลายเดือนก่อน +1

    интеренсо, и сделано красиво

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      Спасибо за обратную связь 👍 и за подписку ▶️

  • @cilcoposea
    @cilcoposea ปีที่แล้ว +3

    nice video editing, if only everything was as clear as in this video. Keep it up! 👍

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว

      Thank you so much for your kind comment! 👍 I'm really glad to hear that you enjoyed the video quality, clear explanations, and editing. New videos are on the way! 🔜

  • @haroonansari3585
    @haroonansari3585 11 หลายเดือนก่อน +1

    keep up the amazing work, exceptionally well-explained 🤯

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน +1

      Thanks for your feedback. 👍 A new video will be released in the coming days: Angular Signals. 🚦

    • @haroonansari3585
      @haroonansari3585 11 หลายเดือนก่อน +1

      @@theigorsedov great to hear that

  • @fajarhadifirmansyah
    @fajarhadifirmansyah 11 หลายเดือนก่อน +1

    Great video 🎉🎉, i am new subcriber hehe

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      Thank you so much for subscribing! 🎉 I'm very glad to have you as part of my channel community. Your support means a lot and helps my channel grow. I hope you enjoy the upcoming content! 😊👍

  • @zenairatv2249
    @zenairatv2249 11 หลายเดือนก่อน +1

    Great Job

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      Thank you! 👍 I'm glad you enjoyed it. 🙂 If you'd like to see more content, please subscribing to my channel for updates on new videos. 🎥

  • @tekforge
    @tekforge 6 หลายเดือนก่อน +1

    great presentation, Igor! May I ask what tool(s) did you use to create it?

    • @theigorsedov
      @theigorsedov  6 หลายเดือนก่อน +1

      Thanks Rakia! I'm glad to hear it!👍 I use a few main tools:
      ● Apple: Final Cut Pro🎞 and Motion
      ● Adobe: Photoshop and Illustrator
      I also use some other tools for specific tasks. 👨‍💻

  • @miskellil4844
    @miskellil4844 ปีที่แล้ว +1

    🎉🎉

  • @alfi7135
    @alfi7135 ปีที่แล้ว +2

    Awesome vid
    +1 sub

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว

      Thank you for subscribing! 👍

  • @AlexanderSemashko-z5f
    @AlexanderSemashko-z5f 11 หลายเดือนก่อน +1

    thx for the video!

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      You're welcome! Glad you enjoyed it!

  • @ferlezcano
    @ferlezcano ปีที่แล้ว +1

    Great video!

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว

      Thanks for watching and for the kind words! 🤝

  • @amanverma8300
    @amanverma8300 6 หลายเดือนก่อน +1

    Very good explanation

    • @theigorsedov
      @theigorsedov  6 หลายเดือนก่อน

      I appreciate the feedback!👍 Glad you found the explanation helpful. Stay tuned for more content!✔️

  • @DeepanshuMalviyaPhysics
    @DeepanshuMalviyaPhysics 11 หลายเดือนก่อน +1

    can we not use *ngIf for the same conditional loading of elements ? whats the difference

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน

      The difference is in priority. "*ngIf" or "@if" - is "here and now" (executed immediately). "@defer" - is later, deferred loading, executed after "here and now". "@defer" unlike "@if" allows you to define blocks that will be loaded later when normal blocks are loaded first.
      With Deferrable Views, you divide your template into two types of blocks: normal and defer. First, normal blocks will be loaded, and only then, defer blocks. As I show in the "video with comments" example, the video is loaded first. Comments are loaded later depending on conditions.
      This approach accelerates the initial page loading, ensuring that users do not have to wait for all page content to load simultaneously.
      I hope I can help you and answer your question. ✔️

  • @mxz2024
    @mxz2024 11 หลายเดือนก่อน +1

    whats the difference to ngif or if? you could load components or parts also based on ngif

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน +1

      The difference is in priority. "@if" operates in the "here and now," while "@defer" acts later, contingent on conditions or actions. The Defer Block enables you to designate (mark) sections of the template that don't require immediate loading. Consequently, this speeds up page loading.
      For example, video loads first on the page, allowing visitors to access it without waiting for the entire page to fully load. Comments on the video and other content, such as advertising, are loaded later.

    • @mxz2024
      @mxz2024 11 หลายเดือนก่อน +1

      @@theigorsedov this means, defer without arguments will make a slight difference in loading speed of parts (order of rendering) and if you use it with a timer it is basically a ngif bound to a method with a settimeout or?

    • @mxz2024
      @mxz2024 11 หลายเดือนก่อน +1

      @@theigorsedov and thank you for the explanation 🙏 so its basically like angulars lazyloading by routing but for parts inside the html itself. with the flexibikity that it can be based on a timer or other triggers

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน +1

      You understood everything absolutely correctly. 🙂
      > defer without arguments will make a slight difference in loading speed of parts
      Yes, that's right - it will move the defer block loading to the end of the queue. 🔚
      > it is basically a ngif bound to a method with a settimeout
      Yes, that is right. Almost all defer blocks are executed after the page is in "idle" status. There is one exception, but it is only one.
      > so its basically like angulars lazyloading by routing but for parts inside the html itself
      This is exactly the point. 👍 Lazy loading for templates: lazy loading (routing level) and deferred loading (template level).

  • @CarlintVeld
    @CarlintVeld ปีที่แล้ว +2

    Are there any requirements for deferred components?

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว

      The new deferrable views feature is available by default in Angular 17. Components can be deferred using deferrable views without any special requirements. As usual, components must be imported and available for use.✔️

  • @arum1430
    @arum1430 ปีที่แล้ว +1

    How to use Eslint in angular 17? Can you please help me with that. Thanks

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว

      Thank you for your question! ❓ Using ESLint in Angular 17 is a great topic suggestion. I'll think about creating a video on ESLint. Thanks for your interest!

  • @nt6494
    @nt6494 11 หลายเดือนก่อน +2

    You have to invest in a better quality microphone.

    • @theigorsedov
      @theigorsedov  11 หลายเดือนก่อน +1

      Thank you for your feedback! I appreciate your suggestion about the microphone. 👍 I'm working on improving the sound quality, and as the channel continues to grow, I plan to invest in better equipment to enhance the overall experience. 🎙

  • @masterlup
    @masterlup ปีที่แล้ว +1

    How did you learn about all this stuff?

    • @theigorsedov
      @theigorsedov  ปีที่แล้ว +3

      I've been researching the upcoming release of Angular 17 for a while now, and I've been following the development process closely. I've read the RFCs, watched the Angular team's livestreams, and I've read discussions on the GitHub repository. 📚 I've also been testing the beta version of Angular 17 and playing with the new features.👨‍💻

  • @powered8473
    @powered8473 6 หลายเดือนก่อน +1

    Игорь очень нужны уроки по Angular на русском плиз.

    • @theigorsedov
      @theigorsedov  6 หลายเดือนก่อน

      Я стараюсь использовать простой английский чтобы охватить как можно больше аудитории, но я думаю о других языках в ближайшем будущем. К сожалению, очень не хватает времени сейчас. Моя первоочередная задача - это увеличение количества видео и частоты их публикации.
      Сейчас я начал выпускать видео раз в 1.5 недели. Моя следующая цель - 2-3 раза в неделю. С развитием канала я смогу выделить больше времени.
      Спасибо что смотрите!

  • @tigranovakyan2783
    @tigranovakyan2783 10 หลายเดือนก่อน +1

    Игорь братан а на русском есть уроки у тебя?)

    • @theigorsedov
      @theigorsedov  10 หลายเดือนก่อน

      К сожалению, на русском нет. В видео стараюсь использовать простой английский, а также делаю упор на визуальное объяснение. :)