Hacker News new | ask | show | jobs
by FezVrasta 3729 days ago
Hi! Popper.js dev here.

There are several advantages:

- The size is half of Tether (3.5 vs 7);

- Popper.js doesn't need any additional CSS in your page;

- It works even with elements not placed as direct children of body;

- It's much much faster (compare both on mobile, you'll see Tether lagging a lot!);

- It automatically detects the size of the tooltip arrow;

- Inside Popper.js you already have a way to create tooltip elements automatically, with Tether you need an additional library;

- Popper.js supports particular "flip" behaviors, you can decide that if there's not space on the left, the tooltip must move on the bottom (for example);

- The whole code is fully documented with JSDoc!

I hope this answers your question

3 comments

I've actually been looking for something that goes the other way. The main issue i've had with Tether and React is that Tether does too much. I don't want a lib that manipulates the DOM itself, I want a overlay positioning engine that I can use to position an element (much like Popper and Tether), but that leaves the positioning up to me (ie let React keep full control of the DOM). Obviously i'd need to subscribe to position updates too, for scroll and resize (and any other) events. I tried to do this using Tether as a starting point, but it was a painful experience trying to to untangle its code.

When I talk about engines, I mean things like Zynga's Scroller (https://github.com/zynga/scroller), essentially a purely logical set of functionality that doesn't assume a particular view-level implementation.

This is exactly the direction I want to take with Popper.js!! The part that sets the style to the DOM will soon be moved to a modifier/plugin so that it can be disabled and replaced with a modifier which just exports the coordinates.
That sounds promising. So conceptually you'd end up with something like popper-engine and popper?
Yup something similar
Please checkout this PR for React support https://github.com/FezVrasta/popper.js/pull/11
Totally understand your pain. Did you try https://huu.la? It never messes up with the user's page DOMs and you don't even need to write code to use it.
May you avoid spam please?
Hey man, take it easy ;)

Huula does solve the problem the user is facing, so by any means, this is not spam at all.

And BTW, we are targeting different segments. You want to serve developers, I want to serve non-tech person, like HRs, Operations, etc. So technically, we are not competitors!

It's just a question of respect
What minimum browsers does this support? I glanced through the documentation, but did not notice it.

Awesome work, by the way.

Tested it in browserstack, works in IE10+. IE9 is close but doesn't work when the browser is small. IE8 doesn't work at all (go figure)
I've tested it on Chrome, Firefox, Edge, Safari, Safari Mobile and Chrome Mobile (latest versions) but I suspect it works on older versions as well.
Awesome!