material-remixer-js icon indicating copy to clipboard operation
material-remixer-js copied to clipboard

Consider replacing node dependencies in iframe with source from CDNs

Open chriscox opened this issue 8 years ago • 2 comments

Remixer has a few dependencies in the iframe overlay, such as Firebase, MDL, and React. They are pulled in via running npm install. However this makes using remixer in online tools such as codepen difficult, as you cannot simply import remixer by itself, and instead need to include all the dependencies.

As a suggestion, lets consider instead pulling in these dependencies via their recommended hosted CDNs from within the iframe.

We don't need to worry about performance here, as the iframe loads in background not needed immediately at page startup.

For reference, the iframe calling code is here.

Suggested CDNs:

Firebase
<script src="https://www.gstatic.com/firebasejs/3.6.9/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/3.6.9/firebase-database.js"></script>

MDL
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.min.css">
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>

React
<script src="https://unpkg.com/react@15/dist/react.min.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script>

chriscox avatar Feb 17 '17 21:02 chriscox

@appsforartists @chuga Hey guys, what do you think? Let me know if you have any strong opinions here one way or the other.

chriscox avatar Feb 17 '17 21:02 chriscox

I know Michael (who runs unpkg) and trust him to be a good person. I've run plenty of code he's written. Still, I'm wary to recommend that people load code from servers we don't control (and hence, can't vouch for the security of).

It's probably fine (React even links to that URL from their homepage), but it's still something I'm wary of as a Googler.

What's the bundle size difference between including these and externalizing them?

appsforartists avatar Feb 17 '17 23:02 appsforartists