Live data from Hacker News

Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

github.com

11–20 of 69 posts

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#11
post #2

I hope this gets used for good, not evil. Lots of sites (you know, those sites, they crop on on HN from time to time) flash up "give me your email address so I can send you spam" boxes before I can read the blog post. Or when it thinks I've gone somewhere else when in fact I just opened it in a new tab. Or if a momentarily switched away. I mostly close blogs that aggressively try to sell me things, but sometimes I wa…

It's unfortunate. However, it's been shown over and over to have the best conversion rate for getting people's emails, so it's a trend that's only going to become more popular from here (until the next high conversion pattern is developed).

Not necessarily. Google just announced that, in the name of accessibility, they will start penalizing sites that use them.

https://webmasters.googleblog.com/2016/08/helping-users-easi...

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#12
post #3

Babel and webpack are megaoverkill for this and account for a good chunk of the 2k gzipped size. The actual library code is barely 140SLOC. There's a lot of room for improvement if this is intended to be a real standalone library (vs. a webpack/babel test).

I believe Waypoints also does this same thing, it's a fairly mature lib. https://github.com/imakewebthings/waypoints

kudos for in-view's demo page though

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#13
post #3

Babel and webpack are megaoverkill for this and account for a good chunk of the 2k gzipped size. The actual library code is barely 140SLOC. There's a lot of room for improvement if this is intended to be a real standalone library (vs. a webpack/babel test).

[deleted]

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#14
post #8

Won't this be a performance killer?

Depends on how you use it and on how much elements. I am not sure if this is even worth to be a library. Sometimes I am wondering why people want to use a lib for everything.

I agree, many times a library isn't necessary. In backbone.js I solved this with an interval triggering a global event which sends current scroll pos to all listening views.

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#16
There is an emerging standard called Intersection Observer that addresses the same use case: https://github.com/WICG/IntersectionObserver/blob/gh-pages/e...

This is a really useful problem to solve. But, I would personally prefer to solve it with a polyfill for a standardized approach that will eventually receive native implementation.

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#17
post #3

Babel and webpack are megaoverkill for this and account for a good chunk of the 2k gzipped size. The actual library code is barely 140SLOC. There's a lot of room for improvement if this is intended to be a real standalone library (vs. a webpack/babel test).

Why is Babel overkill? It lets you write your code in ES6, which is a huge benefit for many reasons.

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#18

Won't this be a performance killer?

Any time you're performing an operation on a scroll event, that is a risk. But this uses a single "scroll" event listener throttled to fire a maximum of every 100ms.

https://github.com/camwiegert/in-view/blob/master/src/in-vie...

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#19
post #17
post #3

Babel and webpack are megaoverkill for this and account for a good chunk of the 2k gzipped size. The actual library code is barely 140SLOC. There's a lot of room for improvement if this is intended to be a real standalone library (vs. a webpack/babel test).

Why is Babel overkill? It lets you write your code in ES6, which is a huge benefit for many reasons.

The fact that it's delivering 140 lines in 5.5kb. That's a lot of bloat! There are ways to write code in ES6 without that (see sibling responses).

Re: Show HN: In-view.js – Get notified when DOM elements enter or exit the viewport

#20
post #17

Earlier quoted context omitted.

Why is Babel overkill? It lets you write your code in ES6, which is a huge benefit for many reasons.

The fact that it's delivering 140 lines in 5.5kb. That's a lot of bloat! There are ways to write code in ES6 without that (see sibling responses).

Hey, author here. I'm very open to ideas to reduce bloat. It's 140 SLOC and ~1.1kb gzipped without lodash/throttle. I considered writing my own throttle, but wanted something more battle-tested.

Does Rollup produce a more efficient bundle in your experience?

Post reply on HN