HTML: Dependencies as data-uris, crashes chrome developer tools

[anthonynorth]

Since version 2.11.2 (relevant commit c1fbe7b), javascript and css dependencies for self-contained html are inlined as data-uris; javascript is also base64 encoded which adds approximately 4/3 bloat.

Chrome & Edge (I'm running latest for both) developer tools don't handle the base64 encoded data uris particularly well. Pages with large javascript dependencies with data-uri sources crash developer tools with out of memory errors; this makes debugging very difficult.

Below is a simple example which crashes chromium devtools when built with pandoc 2.11.2 or newer. This is the getting started example from deck.gl docs

<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.53.0/mapbox-gl.css' rel='stylesheet'>
<script src="https://unpkg.com/deck.gl@latest/dist.min.js"></script>
<!-- optional if mapbox base map is needed -->
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.53.0/mapbox-gl.js'></script>

<style>
  body, html {
    /* override defaults, make map full viewport */
    max-width: unset;
    max-height: unset;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
  }
</style>

<script>
  new deck.DeckGL({
    mapStyle: "https://basemaps.cartocdn.com/gl/positron-nolabels-gl-style/style.json",
    initialViewState: {
      longitude: -122.45,
      latitude: 37.8,
      zoom: 15,
    },
    controller: true,
    layers: [
      new deck.ScatterplotLayer({
        data: [{ position: [-122.45, 37.8], color: [255, 0, 0], radius: 100 }],
        getColor: (d) => d.color,
        getRadius: (d) => d.radius,
      }),
    ],
  });
</script>

Built as a standalone html with

pandoc --from markdown --to html --self-contained deckgl.md > deckgl.html

I've built this document in pandoc 2.11.1.1 & 2.14.2. You can find the built documents in this gist. The output from pandoc 2.11.1.1 is smaller and doesn't crash developer tools, the output from 2.14.2 crashes developer tools.

These issues are related: #3423, #7367

NB. In reality, I use pandoc via rmarkdown and the deck.gl maps are built in R using rdeck. The result is the same. The example above eliminates everything unrelated to pandoc.