Alternative version for browsers without JavaScript support

Dash Python
1

Many robots and some humans browse sites without JavaScript support, in which case they can only see “Loading…”. I do not expect plotly.js to run in a browser without JS, but I hope there is an easy way to place a stub when JavaScript is disabled.

Is this possible and how do I do this?

Here are desiderata ordered from basic to ideal.

  1. Replace “Loading…” with custom text.
  2. Replace “Loading…” with a custom page (i.e. html tags, images etc)
  3. Same as 2, but defined programmatically using Dash.html components (as opposed to being placed in assets or otherwise injected from a static file)
  4. Same as 3, but the static page is produced by a layout() callable on request.
  5. Each endpoint (or, to be precise, a GET request path) displays its own page when JavaScript is disabled
  6. Same as 5. but defined programmatically using Dash.html components.
  7. Same as 6, but the static pages are produced by layout() callables on request.

I have some but a shallow understanding of how Dash renders a page in a browser and how it interacts with Flask. For instance, I’ve never worked with JS beyond simple client-side callbacks or with Flask views and template rendering. I would be grateful for answers that keep this in mind when outlining if and how any of 1…7 are achievable and what components of the entire system have to be changed.

2

Hello @avm23,

The whole application would have to be rewritten, and the components would not even render as they are React(JS).

If you need something like this, you could create your own index.html file and render that in the event that javascript is not enabled. :slight_smile:

1 Like
3
  • Could you please outline how to insert index.html if JavaScript is disabled?
    A quick websearch suggests that one should use <noscript> tag and then redirect. Can I replace this div using Dash?
<div id="react-entry-point">
    <div class="_dash-loading">
        Loading...
    </div>
</div>

If not, how do I insert <noscript> into the page?

  • Also, is there a way to generate a static HTML code block from a Python-defined Dash layout? Other than opening source in the browser and copying the relevant parts? My goal is to find a way to automate repeating edits in the dynamic and static (no JS) versions of a page.
4

They probably just included noscript for completion, as this would never render because it needs JS to even process to show. :slight_smile:

Here is a way that you can customize the index:

This would allow you to pass something in there to display an image if there is no JS enabled.

1 Like