JS transpiling & polyfills vs browser support

I’m still in progress of learning JS, and in many books/tutorials I was watching – people were pointing the importance of using features which are supported in all browsers, a bit later I’ve learned about tools like Babel and the advantages of it. I like new “the syntactical sugar” and would like to use it instead of old functionalities that are widely accepted. For example appendChild(); insertAdjacentElement; replaceChild(); removeChild(); could be replaced with something like append(); prepend(); before(); after(); replaceWith(); remove();. Now, my question is would it be fine if I use latter ones and depend on tools for older browsers or should I use features that are widely supported?


I’d suggest learning and training your skills with modern JS and current browsers – if you need to support older browsers at some point, deal with that then. Avoid premature optimization and abstraction.