I'm in a dilemma to choose an approach for the effective mitigation of XSS in one of my apps and some libs I had forked from GitHub. The thing is to prevent XSS, all we need to do is to escape/encode/sanitize (whatever) the untrusted strings/inputs within the DOM. I stumbled on a couple of options.
- Use a 3rd party library - But, this one increases the size, LOC (lines of code) tremendously (exaggerating a little bit here, I know there are lighter libs out there). What I meant is, I don't want another dependency on my app/lib for this thing alone, cuz it's not that critical unless it becomes a pain in the "you know what I mean". My possible candidates are "dompurify", "xss", "sanitize-html". Personally, I'd go with "dompurify", cuz it's simple to use. But what about "xss"? it's like 1 kb lighter than "dompurify", I may need to have a closer look.
- Next one is more like a workaround, which is to write a hacky JavaScript function maybe like the one in this stackoverflow link, Native JavaScript or ES6 way to encode and decode HTML entities?.
Which would be a better way, would this workaround function be enough for preventing the XSS? or shall I go with the adding whole new lib into my codebase?
I know this is kind of a naïve, beginner level question, still you see I had to ask... otherwise my head's gonna be exploding... Need some perspectives. Please.. I'd love to hear your thoughts guys.... Love this platform.