Difference between popper.js and tether.js

JavaScript
1

From what I understand are Popper.js and Thether.js both positioning libraries but I don’t understand the difference. Some recommend using Popper.js while others recommend Tether.js. Can someone please explain the difference between the two and why I should use one over the other.

Thank you in advance!!

2

Based on the chart at https://www.npmtrends.com/popper.js-vs-tether you should go with Popper.

1 Like
3

Meanwhile, according to a popper dev (so, no bias avoidance here), the advantages of popper are:

  • 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!

source: https://news.ycombinator.com/item?id=11439947
1 Like
4

Hi @Paul_Wilkins.

Thanks for the fast reply and recommendation. I asked this because I noticed that certain elements (for example a page loader i try to use) on a site are not working while using Tether.js. In addition, are the advantages you describe about Popper.js also a nice extra. So it becomes Popper.js. Again thx for the reply.

5

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.