js-xss VS showdown

Compare js-xss vs showdown and see what are their differences.

js-xss

Sanitize untrusted HTML (to prevent XSS) with a configuration specified by a Whitelist (by leizongmin)

showdown

A bidirectional Markdown to HTML to Markdown converter written in Javascript (by showdownjs)
Our great sponsors
  • OPS - Build and Run Open Source Unikernels
  • SonarQube - Static code analysis for 29 languages.
  • Scout APM - Less time debugging, more time building
js-xss showdown
2 6
4,376 12,215
- 0.9%
5.6 5.3
24 days ago 12 days ago
HTML JavaScript
GNU General Public License v3.0 or later MIT License
The number of mentions indicates the total number of mentions that we've tracked plus the number of user suggested alternatives.
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.

js-xss

Posts with mentions or reviews of js-xss. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2021-02-16.

showdown

Posts with mentions or reviews of showdown. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2021-12-20.
  • A Colorful Textarea
    2 projects | dev.to | 20 Dec 2021
    Adding syntax highlighting to an input field can be a hard task. supports neither styling of individual characters or words, nor HTML tags within itself, there is no fully supported native solution for that. Most editors work with contenteditable to actually render a fully marked up code snippet and let the user edit its content. This requires a lot of work to get it accessible (as in restore all the native functions of a textarea) and still adds a lot of complexity.
    If you don't want that and are just looking for a quick, dead-simple solution: Here's how to colorize a textarea.

    Solution

    The trick is to separate the input element from the displayed one. We can't color the content of a textarea, but we can make it invisible and replace it with marked up content. This works with monospaced fonts and fonts with a uniform width across normal, bold and italic characters. I'm using this for code and markdown, so that's perfectly acceptable for me. We also need to be careful to match the dimensions of the textarea exactly while only using font-relative units like em, to ensure that the highlight element scales well with the invisible textarea. The cursor is still in the textarea's context, while the text itself is rendered in the highlight element. We want to match every character of the textarea to match the highlighted one on a pixel-perfect basis.

    A 3D explosion schema of the layout. In the background is a greyed out textarea with a colored cursor after the last character. It's content is a code snipet of an empty html5 page. The foreground is the same text, but syntax-highlighted in bright colors. The cursor of the textarea reaches into the foreground.

    I also need to auto-resize my textarea. Since textareas usually scroll vertically, that would mess up the position matching with the highlight element. Auto-resizing seems like a graceful workaround to me.

    The highlghting itself would work with every code parser. I'm using highlight.js to convert markdown to syntax-highlighted HTML. I listen for content changes in the textarea and parse new rendered code on every input. To counter the worst performance hits, I'll just use requestAnimationFrame. Debouncing isn't an option here, because the user would only see what they've written after they've finished typing. That'd be very poor UX.

    Demo

    Note that this example also displays the rendered Markdown in a separate element. I'll use the change listener that I already have to splice in a Markdown renderer: Showdown.

    Pros

    • as accessible as a textarea
    • is a progressively enhanced feature
    • can be styled exactly to your needs
    • dead simple solution compared to a rich text editor

    Cons

    • has performance issues with large texts (as do textareas in general)
    • works only with monospaced fonts
    • works only with auto-sizing textareas

    This article was written in a textarea :)

  • Creating markdown blog or docs generator with js (serverless).
    1 project | dev.to | 14 Dec 2021
    You should visit to official docs for advanced level tools of library. I'll show you how you can convert the md into html with GitHub flavour of markdown.
  • How to handle Blog Page in a website without a database?
    1 project | reddit.com/r/reactjs | 12 Jun 2021
    Markdown to HTML : It seems good to me(it gives the freedom regarding styling of article) but again the problem is where would I store the data.
  • Using Markdown as HTML
    1 project | news.ycombinator.com | 2 May 2021
    I had an idea a while ago. Instead of dealing with two sets of files, why not make a file that was Markdown and HTML at the same time?

    I found this utility, which unfortunately seems to have been abandoned: https://github.com/showdownjs/showdown

    All you need to do is add a few lines to the top of your Markdown file. Here's an example:

    https://trivialcode.com/mdhtml_demo/demo.mdhtml

    Take a look at the source of the .mdhtml file and you'll see what I mean.

    If you're taking notes in Markdown this might make things a bit easier to keep organized. No need to update anything if you're exporting to HTML.

    Thoughts? Is this a good idea? A bad one? I also wondered if generating Markdown via a web server and then converting it on the fly like this would be an interesting exercise. Seems like it'd be simpler than generating HTML.

    I use Vim, so I've put this in my vimrc for editing:

    autocmd BufNewFile,BufRead *.mdhtml set syntax=markdown

    First time posting here. Let me know what you guys think.

  • Browser extension - Integrate your features securely
    2 projects | dev.to | 16 Feb 2021
    In order to transform the Markdown to HTLM, we can use a generator such as showdown. It's really easy to use:
  • CSS style to make HTML look like raw markdown
    2 projects | reddit.com/r/Markdown | 7 Feb 2021
    or are you asking general technical question about markdown handling? there are existing solution which already do two-way convertion, including showdown and reddit comment box, the secret to make them "live" is to update both fields on key-down even

What are some alternatives?

When comparing js-xss and showdown you can also consider the following projects:

DOMPurify - DOMPurify - a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG. DOMPurify works with a secure default, but offers a lot of configurability and hooks. Demo:

sanitize-html - Clean up user-submitted HTML, preserving whitelisted elements and whitelisted attributes on a per-element basis. Built on htmlparser2 for speed and tolerance

xss-filters

Retire.js - scanner detecting the use of JavaScript libraries with known vulnerabilities

remarkable - Markdown parser, done right. Commonmark support, extensions, syntax plugins, high speed - all in one. Gulp and metalsmith plugins available. Used by Facebook, Docusaurus and many others! Use https://github.com/breakdance/breakdance for HTML-to-markdown conversion. Use https://github.com/jonschlinkert/markdown-toc to generate a table of contents.

Markdig - A fast, powerful, CommonMark compliant, extensible Markdown processor for .NET

markdown-raw - CSS style to make HTML look like raw markdown

cms.js - Client-Side JavaScript Site Generator

Themis - Easy to use cryptographic framework for data protection: secure messaging with forward secrecy and secure data storage. Has unified APIs across 14 platforms.

indoynab - An online YNAB converter for your Indonesian bank statements. No install, no sign-up. Currently covering: BCA, BNI, BSI, Jenius.

prettier - Prettier is an opinionated code formatter.

node-html-to-text - Advanced html to text converter