what would be a good way to apply JavaScript polyfills for web pages?

[blue_dragon]

for example some sites use Intl.DisplayNames, some use ReadableStream#pipeThrough, TransformStream, TextEncoderStream, etc... and currently Pale Moon doesn't have these but can be easily polyfilled. i used to use GreaseMonkey for PM to polyfill these classes on every site but the problem is that the polyfilled objects are actually allocated separately in the memory for each tab/page/window and this seems to be a bad approach. is it possible to make an add-on that polyfills a class globally for every tabs? i tried declaring the polyfilling classes in bootstrap.js and using Components.utils.exportFunction but it was a failure since it has issues like returned objects not being able to be accessed in the web page level content scripts due to permission problems unless you use Components.utils.cloneInto, and also there is a problem that the polyfilled functions use the extension privileged native classes at browser's chrome internally which is also potentially a problem.

[vannilla]

While it's more complex than that, from a bird's eye perspective each Javascript object and class and function is allocated separately for each tab, so the Greasemonkey approach is perfectly fine.
Besides, most places that rely on these (mis-)features already load several megabytes of code, adding one more "fresh" definition won't harm anything unless your RAM is 99% full.