Web Workers in Action - Performance Boost for Web Applications (2023)

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

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

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

    Level up your Angular skills with my advanced courses 🚀
    bit.ly/advanced-angular-courses

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

    your free contents literally better than paid courses 🎉

  • @kovvbasa
    @kovvbasa ปีที่แล้ว +5

    Дякую за контент, це золото

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

      Дякую пане Буданов 😄🙌🏻

  • @ВолодимирНакутний
    @ВолодимирНакутний ปีที่แล้ว +1

    дякую за контент!!!!

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

    thats a rare case but very useful when you need it.

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

    Where is the super like button. Great in-depth content as always

  • @gonzalocorchon6509
    @gonzalocorchon6509 ปีที่แล้ว +4

    Brilliant as usual. I'm not sure if I will have to leverage all of its potential in the near future but for sure this video is a masterpiece showing content that is not widely available in any other place. Thank you!

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

    Thanks for good explanation, now it’s clear

  • @ЄгорПавленко-м4ь
    @ЄгорПавленко-м4ь ปีที่แล้ว +11

    Looks like spawned worker doesn't have that "x6 slow" limitation, main thread has.

  • @nandolambrusco
    @nandolambrusco 9 หลายเดือนก่อน +1

    Thank you, absolutly fantastic video🙏

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

    Дякую за контент

  • @bancamilleri1546
    @bancamilleri1546 ปีที่แล้ว +7

    Nice video. I think the image processing was so much quicker when using the worker is because Chrome's CPU throttling wasn't being applied to the worker.

    • @DecodedFrontend
      @DecodedFrontend  ปีที่แล้ว +9

      Maybe yes or maybe because it is the real OS thread and can invoke more resources… Here I might be wrong because that is not the area where I am so confident :) What I wanted to say in the video is that while worker performed their work the main thread wasn't blocked and users could still interact with the application without glitches :)

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

    Дякуемо, Дмитро!

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

    Great as always

  • @MehediHKakon
    @MehediHKakon ปีที่แล้ว +4

    Another masterpiece. Thank you for sharing. Could you please share some advice on how to learn things under the hood like you do, what kind of thought process should I have when I'm learning?

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

    this video was super useful, thanks buddy

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

    Комментарий для продвижения канала, спасибо за то, что делаете. Отличный контент!!

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

    Thank you for this amazing content you create

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

      You are welcome 😊glad you like it

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

    Excellent, love the way you explane the concept

  • @Intikanne
    @Intikanne 4 หลายเดือนก่อน

    Thank you so much for this incredible explanation of web workers! 🌟 Your clear and straightforward approach made a complex topic so much easier to grasp. I really appreciate the effort you put into making it accessible and engaging. Keep up the fantastic work!

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

    Thank you, very comprehensible especially for use, fro pros and corns of using

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

    Useful video, and a gorgeous cat 🐈

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

    very well explained as always. peace!

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

    Decoced Frontend, you are bang-on as always. Can we expect a tutorial on Service Worker as well?

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

    thanks it was very informative.

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

    I'm a total noob with web workers but it was very clear, thanks man

  •  ปีที่แล้ว

    Awesome video on web workers. I used to be so confused about them and it was hard to find well explained resources along side practical examples.
    Il will definitively recommand this video to my team.

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

    Hi Dmytro, Excellent introductory video on the topic of Web Workers. I think it would have been worth stressing they are not a feature of Angular but a Web API (maybe show the MDN page).
    To complete the discussion it would also be worth showing how you might write a unit test/exercise a web worker.
    Thanks.

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

    Greate video, thanks

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

    Nice video!

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

    Thanks a lot, as usual everything arranged and explained

  • @codearabawy
    @codearabawy 8 หลายเดือนก่อน +1

    I really like how you explain it. So in Angular, let's say you're using mat-table from angular material. I know a lot of people had some performance issue with it. Is it a good idea to use web-worker for a long running API requests? If yes, would web-worker solves the perfomance issue with loading thousands of rows into that mat-table component?

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

    Incredible useful! This all is based on strategy pattern, I am a Java programmer an this is very alike annotations made by Martin Odersky in Java 7

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

    Great to see new content from you :)

  • @mylifefeabric
    @mylifefeabric 4 หลายเดือนก่อน

    Thanks for sharing :) Small point - It would be useful to emphasize that the Webworker runs outside of the angular context, so there's no access to your angular context, apart from passing things through as parameters.

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

    Amazing content as always! Thank you so much, this was super helpful for me 😄

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

    thank you! as always - rally good quality👍

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

    Thanks for the new content!

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

    Thank you for the great video!

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

    Thanks for another useful video, Dmytro) Very interesting and informative as usual

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

    For SSR provide a fallback mechanism to perform the computations that the worker would Perform.

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

    Hello there, i have learned a lot woth your videos and Thanks a lot for that
    I was hoping that you could make some videos on nx workspaces it would be a great series
    Thanks

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

    the 192ms in the Webworker version was just for setup. The filter took ~500ms which is the 3110ms / 6(CPU throttling) In other words, CPU throttling did not apply to the Webworker and in the end the whole thing even took a little longer because of the message passing. In the end there was no speed up but still unloading the main thread which is still a good thing. To actually get speed up you could have segmented the image into patches and fed each one to its own Webworker. This would have actually reduced total processing time if you have a multi core CPU which you most certainly do.

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

    Really great video! I want to ask question since we moved out the implementation to the worker, how does this same method work fast in webWorker? but not in the angular context? I understand the concept of using webWorker to take care of heavy-lifting and not blocking of main-thread and that's what it is doing but how it is increasing performance.

  • @amirhosseinrastegar8144
    @amirhosseinrastegar8144 21 วันที่ผ่านมา

    can you provide more content on service worker and its usecases?

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

    Thank you,
    Now we have how to switch context from main thread to worker and back.
    Can you please look into issue of browser being non-responsive when large data is loaded on the screen without using AJAX calls to get chunk of data? How do we optimize such scenario? For example, a select drop down having large options.

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

      Thanks for your question. I think the Virtual Scrolling from Angular CDK will help you.

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

    I would love to see and example of this, maybe build into a service, where the usage of it just being subscribing to the service that handles webworker task including listening for messages. Also to help with some stricter typing. The times i have used webworkers, its just been with basic javascript. I would like to use interfaces to make it more type "safe".

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

    How to use interfaces or any common types between component and webworker?

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

    Thanks for the knowledge but do you recommend executing expensive Http services from the worker

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

    Thanks for the amazing video, just need to ask that this webworker can be used for saving the object position on the canvas like on moving event scaling event like saving there x and y cordinatiiones while performing canvas event?

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

    Thank you for great tutorial ....I just wonder if it is possible to chain the workers to apply multi tasks in a queue and once done pass refreshing main thread? How does the communication between main and several workers works?

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

    Thanks! Learnt something new today :)
    Would it be possible to efficiently wrap a large JSON array into an ArrayBuffer to avoid data duplication?

  • @03mylol
    @03mylol ปีที่แล้ว

    Ty 4 video. Hower, i have one question left. How does webworker performs it's calculation? Is it something similar to Web API or does it take a separate computer thread in that case and if so, is there a way of using webworker on single thread cpu?

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

    So in a shorthand analogy JS is a Boss that does not delegate tasks to staff as long as you employ some workers and start delegating :)

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

    0:57 is that was blink like "naaa, I'm kidding"? :D

  • @amitkumar-xu3ie
    @amitkumar-xu3ie ปีที่แล้ว

    I have a stupid question not specifically related to this topic. What is the advantage of providing types to the property with this operator (!:) like in the video I saw all the properties declared like private worker !: Worker. We could have provided type by worker : Worker also. So what's the reason here?

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

    Дякую за відео! Мав досвід генерування великих пдф файлів з допомою веб воркерів. Чудово вирішували таку проблему.
    Памʼятаю що стикався з фактом що файл воркеру скачувався багато разів (як розумію на кожен інстанс воркера, проте не впевнений). Звідси 2 питання (не обовязково до автора, може хтось стикався):
    1. Чи є ліміт на кількість воркерів для 1єї таби?
    2. Якщо n інстансів воркера створюються з 1го файлу, чи дійсно це призводить до того що той самий файл фетчиться n раз? Чи можна цьому якось запобігти?

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

    Спасибо!

  • @виталийвольф-у4т
    @виталийвольф-у4т ปีที่แล้ว

    спасибо за контент, было интересно
    вопрос: есть ли на канале может видео про то какие полезные плагины для Ангуляра ты используешь в своей ide-шке?

    • @eoz
      @eoz ปีที่แล้ว +4

      Maybe try to speak a different language, at least while the war is not over.

    • @виталийвольф-у4т
      @виталийвольф-у4т ปีที่แล้ว

      @@eoz maybe u should delete video about Saint Petersburg from yr channel first, hypocrite)

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

    A CAT on the couch!!!!!!!!!!!

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

    SSR has its own workers

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

    I was thinking about sharing this video with teammates, but it so OP that I've decided to be first it team, who will use the worker 😈

  • @user-rp9iis1en6h
    @user-rp9iis1en6h 6 หลายเดือนก่อน

    Please make video on indexdb that is available on chrome or Firefox browser