Add a note to the Datasette footer measuring the total page load time

Install this plugin in the same environment as Datasette.

datasette install datasette-total-page-time

Once this plugin is installed, a note will appear in the footer of every page showing how long the page took to generate.

Queries took 326.74ms · Page took 386.310ms

Measuring how long a page takes to load and then injecting that note into the page is tricky, because you need to finish generating the page before you know how long it took to load it!

This plugin uses the asgi_wrapper plugin hook to measure the time taken by Datasette and then inject the following JavaScript at the bottom of the response, after the closing tag but with the correct measured value:

<script>
let footer = document.querySelector("footer");
if (footer) {
    let ms = 37.224;
    let s = ` · Page took ${ms.toFixed(3)}ms`;
    footer.innerHTML += s;
}
script>

This script is injected only on pages with the text/html content type - so it should not affect JSON or CSV returned by Datasette.

To set up this plugin locally, first checkout the code. Then create a new virtual environment:

cd datasette-total-page-time
python3 -mvenv venv
source venv/bin/activate

Now install the dependencies and test dependencies:

pip install -e '.[test]'

To run the tests:

pytest