Qiskit / documentation

The documentation content home for https://docs.quantum.ibm.com.
https://docs.quantum.ibm.com
Apache License 2.0
36 stars 57 forks source link

Consider adding a check for notebook (and image?) file size #1678

Open Eric-Arellano opened 1 month ago

Eric-Arellano commented 1 month ago

https://github.com/Qiskit/documentation/pull/1673 is an example of an enormous file size we didn't realize. That has two major downsides:

  1. Makes the site slower for users to access, especially when they have slow Internet
  2. Slows down next.js's build process

I think https://github.com/Qiskit/documentation/issues/1672 may help address this. But either way, we may want to add a check that file sizes don't cross a threshold, e.g. >400MB. This would be at least for Jupyter notebooks, but maybe also for dedicated image files.

The allowlist mechanism should set new thresholds, e.g. (my-file.ipynb, 600) to set a threshold of 600MB.

FYI: how to reduce Jupyter notebook image size

Often PNGs are smaller than SVGs:

# Don't use SVGs for this file because the images are too large,
# and the SVGs are much larger than their PNGs equivalents.
%config InlineBackend.figure_format='png'

You can reduce the resolution of Matplotlib figures. However, this often makes the image less useful and I think it tends to be better to instead set figsize:

import matplotlib
matplotlib.rcParams["figure.dpi"] = 100

You can sometimes set figsize directly in Qiskit SDK:

# We set `figsize` to a smaller size to make the documentation website faster
# to load. Normally, you do not need to set the argument.
plot_gate_map(backend, figsize=(4, 4))

If figsize is not exposed, then you can change the returning figure:

fig = plot_circuit_layout(isa_circuit, backend=backend)
fig.set_size_inches(0.5 * fig.get_size_inches())
fig

One of the other techniques is to see if any of the images can be removed entirely. Are they pulling their weight?

frankharkins commented 1 month ago

Note that unless the SVG is is significantly bigger than its PNG equivalent, it may still load faster for users. SVGs can be compressed a lot when sent over the network, whereas PNGs are already compressed so the file size we see is much closer to what's actually sent.