Svelte Action Examples: use:viewport

💻 REPL: svelte.dev/rep...
📚 Related Resources
Tutorials svelte.dev/tut...
IntersectionObserver API developer.mozi...
🥰 Support me www.buymeacoff...
🔗 Want to learn more from me? Check out these links:
Twitter: / lihautan
Blog: lihautan.com/
Newsletter: lihautan.com/n...
#svelte #svelteactions
Thanks for watching 🥰 -- with love, Li Hau

[@reitznerdomenik]

Love the svelteness!
I would make a function called getIntersectionObserver which would initialize (if it is undefined) and than return it.

[@SkaArg87]

I love your videos, thanks for sharing your knowledge, you explain very well! Greetings from Argentina

[@lihautan]

You're welcome!

[@xanderalijah3708]

You all probably dont give a damn but does anyone know of a trick to log back into an instagram account??
I somehow lost the account password. I love any help you can offer me

[@mohammedtristen1094]

@Xander Alijah Instablaster :)

[@xanderalijah3708]

@Mohammed Tristen thanks for your reply. I found the site thru google and Im trying it out atm.
Looks like it's gonna take quite some time so I will get back to you later when my account password hopefully is recovered.

[@xanderalijah3708]

@Mohammed Tristen it worked and I finally got access to my account again. Im so happy:D
Thanks so much, you saved my ass!

[@SuperQuwertz]

Thank you so much for sharing this tutorials!

[@vqt123]

great video. I got it working but I do see some errors with typescript. Do you know what needs to be updated to support typescript?

[@RaviKumar-fx5dz]

you are a good tutor on svelte. Thank you.

[@lihautan]

Thank you! 😎

[@vansoundz]

Learned something new, Thanks

[@lihautan]

Glad to hear it!

[@HotRatsAndTheStooges]

This was very informative, thanks for such a simple and easy to understand tutorial!

[@lihautan]

More to come!! 😀

[@blokche_dev]

One intersection observer is fine if you only need to share the same root element and threshold parameters I guess.
Again, thanks for sharing and taking care of potential performance issues as you do. 👍

[@lihautan]

Yea you are right, probably in that case may need to create a new intersectionObserver if it's not possible to share

[@PaulHobbs23]

Great video, keep it up! I like your fast and clear explanations.

[@lihautan]

thank you!

[@justinoneill2837]

Great content! NEVER STOP!!!!!!!

[@SusanthCom]

Fantastic. Really Useful 🔥🔥🔥

[@lihautan]

Thank you! 🔥🔥

[@edward.newgate.capitan]

when I use your example in SvelteKit, I get ts error - "Argument of type '{ "on:enterViewport": () => void; "on:exitViewport": () => void; }' is not assignable to parameter of type 'Omit & HTMLAttributes'.
Object literal may only specify known properties, and '"on:enterViewport"' does not exist in type 'Omit & HTMLAttributes'.ts(2345)" Сan you tell me what is the problem?

[@liam_k]

i have the same error, did you find a solution

[@artneo7]

That's awesome, thanks a lot! 😄

[@OnlyWoody]

The first thing that comes in my mind when seeing this API is virtualizing lists of elements, when you'd only render them when near viewport. I have not yet found a working solution like this for Svelte and maybe that would be a nice replacement for svelte-virtual-list which has a lot of drawbacks

[@werethehausers904]

Thank you. Again.

[@lihautan]

You're welcome!! 👍

[@karpeevkonstantin9564]

Thank you very much!

[@lihautan]

You're welcome!! 😁

[@eminqasimovdev]

Can you make one video about svelte-dnd-action? I ask so many things sorry.

[@lihautan]

No worries! I'm adding it to my videos to-make list now

[@eminqasimovdev]

@@lihautan I am waiting for like it soon 👏

[@AlfredLotsu-m6l]

Hi Lihau!

[@ofeenee]

You are being missed.

[@_nom_]

This framework is the worst. Vue is 100000x better.