In-view.js
Languages and libraries
javascript library
SHOW HN2016
118points
62comments
#304of 2,264 in 2016
Top 14%of 2016 by points
How HN took it
MixedNo clear lean
4 positive, 13 neutral or asking, 0 mixed, 12 critical, out of 29 comments about the project. Thread score -0.24.
Performance: 0 for, 7 againstIdea: 2 for, 3 againstExecution: 1 for, 1 againstDocs: 0 for, 1 againstDesign: 1 for, 0 against
The thread, comment by comment
Each row is a top-level comment and its replies, in HN's order. Select a cell to open that comment on HN.
positive neutral or mixed critical about another commenter or something else the maker
What HN said
What people liked
Clear code and efficient implementation
From 1 comment
I made something similar for use with Knockout.js. Love your clear code and efficient implementation! I will probably swap out my core logic for yours. Some here have mentioned…
incogitomode on HN
Demo page is good
From 1 comment
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
Eric_WVGG on HN
Objections
Should use the standard IntersectionObserver API or polyfill instead
From 3 comments
There is an emerging standard called Intersection Observer that addresses the same use case: https://github.com/WICG/IntersectionObserver/blob/gh-pages/explainer.md This is a…
cdata on HNAll the more reason to experiment with the proposed standard API and contribute feedback. The advantages of standardization and eventual native implementation outweigh the…
cdata on HNA spec being draft seems like an odd reason to ignore it and do a completely different API. Intersection Observer has been implemented in Chrome since 51, and Opera since 38.…
spankalee on HN
Performance cost of scroll handlers and layout reads
From 3 comments
I know that this type of functionality is useful, but please consider the performance implications before doing anything like this. Non-native implementations (i.e. not…
wldlyinaccurate on HNBabel 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…
dmbass on HNWhenever you attach an event handler on scroll, it can impact page performance because the javascript needs to be evaluated before the scroll event can continue AFAIK...going…
iamleppert on HN
Bundle size is bloated for 140 lines of code
From 3 comments
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…
dmbass on HNThe 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).
nathancahill on HNNot sure why I was downvoted, I think it's a valid point. To prove it, here's the functionality of your library in ES5 with a naive throttle function:…
nathancahill on HN
Missing edge cases
From 1 comment
There are a lot of edge cases to handle when creating a library like that and I cannot see them dealt with in this library. More than three years ago I created in-viewport and…
vvoyer on HN
Requests
Reduce bundle size
From 2 comments
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).
nathancahill on HNNot sure why I was downvoted, I think it's a valid point. To prove it, here's the functionality of your library in ES5 with a naive throttle function:…
nathancahill on HN
Document the relation to IntersectionObserver
From 1 comment
All the more reason to experiment with the proposed standard API and contribute feedback. The advantages of standardization and eventual native implementation outweigh the…
cdata on HN
Questions
Is IntersectionObserver a viable alternative given draft status
From 1 comment
I hear you. But, isn't this just an editor's draft spec? Only Chrome and Android have done any implementation at all. So, as far as I can tell, there's a chance this will never…
Heqx on HN
Would rollup produce a smaller bundle
From 1 comment
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…
Heqx on HN
Alternatives named
IntersectionObserver
From 2 comments
There is an emerging standard called Intersection Observer that addresses the same use case: https://github.com/WICG/IntersectionObserver/blob/gh-pages/explainer.md This is a…
cdata on HNA spec being draft seems like an odd reason to ignore it and do a completely different API. Intersection Observer has been implemented in Chrome since 51, and Opera since 38.…
spankalee on HN
Waypoints
From 1 comment
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
Eric_WVGG on HN
in-viewport
From 1 comment
There are a lot of edge cases to handle when creating a library like that and I cannot see them dealt with in this library. More than three years ago I created in-viewport and…
vvoyer on HN
jquery-visible
From 1 comment
Similar to https://github.com/customd/jquery-visible which I use a lot.
hiphopyo on HN
onScreen
From 1 comment
I am using this technique to lazy load and unload videos on my site[1]. Since there are many videos that autoplay on scroll, some mechanism is needed to stop loading a video that…
spython on HN
Echo.js
From 1 comment
Yes, lazy loading is a good use case. Echo.js (https://github.com/toddmotto/echo) is another small no-dependency library (1.89 KB minified), which detects elements appearing on…
talklittle on HN