Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Automatically include jsdom? #5

Closed
mesqueeb opened this issue Oct 19, 2019 · 1 comment
Closed

Automatically include jsdom? #5

mesqueeb opened this issue Oct 19, 2019 · 1 comment
Labels
Type: Question Further information is requested

Comments

@mesqueeb
Copy link

Hi @azu
I was intrigued by your comment here:
markedjs/marked#1519 (comment)

@UziTech Yes, I know.

I've tried to use marked@0.7 and DOMPurify, but this combination has a bit complex context.
Because, DOMPurify does not work on Node.js without jsdom.

  • marked is universal/isomophic library

  • DOMPurify is not universal/isomophic library

    • It require jsdom for Node.js

The browser enviroment does not need jsdom, but Node.js env does need jsdom.
It require a bit complex code.

if(THIS_ENV_IS_NODE){
  return marked + dompurify + jsdom
} else{
  return marked + dompurify
}

So, I've created a wrapper library for optimizing Browser and Node.js.

safe-marked is a wrapper library of marked, DOMPurify, and jsdom.
Also, safe-marked define 'browser' field in package.json for optimizing browser bundle.
The browser entry point does not include jsdom.

This wrapper aim to reduce pacakge size for browser.

  package           size      minified  gzipped
  safe-marked       90.15 KB  39.36 KB  13.82 KB (browser bundle size)
  marked@0.7.0      45.05 KB  23.87 KB  7.87 KB
  dompurify@1.0.11  45.21 KB  15.3 KB   5.99 KB
  
  # Other Markdown library  
  markdown-it@9.0.0  325.52 KB  92.69 KB  32.77 KB
  showdown@1.9.0     157.28 KB  71.06 KB  23.55 KB

Conclusion

The documentation just say following

Marked does not sanitize the output HTML. Please use a sanitize library, like DOMPurify (recommended), sanitize-html or insane on the output HTML! 🚨

Afte using marked + DOMPurify, I feed that it is hard to use marked safety.
I think that we need to improve documentation about the usage of sanitizing.
Or just come back to support sanitize option...

However, The documentation is not fundamental solution.

Thanks.

📝 Note: The size of recommentation libraries :

sanitize-html is too large. insane looks like that is not maintained and have some problem.
So, I've selected DOMPurify. DOMPurify is maintained by security company.

  package               size      minified   gzipped
  dompurify@1.0.11      45.21 KB  15.3 KB    5.99 KB
  sanitize-html@1.20.1  1.02 MB   210.06 KB  64.81 KB
  insane@2.6.2          18.61 KB  4.64 KB    1.9 KB

Also, I love package size of marked ❤️

However, does safe-marked include JSDom by default? If I don't use SSR in an SPA of mine, I might not need JSDom.

@azu azu added the Type: Question Further information is requested label Oct 19, 2019
@azu
Copy link
Owner

azu commented Oct 19, 2019

safe-marked define browser field.
In other word, safe-marked pacakge includes two type of entry point.

So, browser entrypoint does not includes jsdom. (just use marked + dompurify)

webpack support browser field and the output bundle does not includes jsdom.
https://webpack.js.org/configuration/resolve/#resolvemainfields

Does my answer make sense?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants