There are plug-ins that blur the background - how do they work?

Question

JavaScript

There are many plugins that blur the background: some are crooked, others are even crooked, others are all in bugs.
What mechanism do they work on? Which way to look?
There's also macOS system blur, which I assume is used on the macOS site - how do I use it?

Answer 1

https://developer.mozilla.org/ru/docs/Web/CSS/filter
Or
html2canvas.hertzen.com
+
www.quasimondo.com/BoxBlurForCanvas/FastBlurDemo.html

Answer 2

Unfortunately, there is no silver bullet.
There is blur in ccs3, it blurs the element along with the content, it is slow.
There is a backdrop-filter that blurs exactly what lies under the element without touching the content - support at the level of an experimental feature.
As for how plugins work, if without CSS - I'm sure they work not for any content, but for prepared content. There is a trick with two pictures - normal and smeared, when the background is normal, and the element on top is smeared. By positioning the element on top and its background, we pretend that we are blurring the image below us
PS The backdrop-filter is used on the Apple website