fix flicker when external CSS used

When we updated to flask 2.0, the default caching time changed to
0. When setting the HTML of a new card side in the DOM, the browser
first removes the existing content (including styling), then sends a
HTTP request to us to check whether the file has changed or not. By the
time the answer has arrived, the browser has repainted without the
styling, and thus we get a flicker.

A side-effect of reverting to flask 1.x behaviour is that external changes
to media files will not be reflected in Anki for an hour, unless Anki
is restarted, or the caches are cleared manually with an add-on. An
alternative approach would be to pre-fetch the css files like we do with
images, but there are other things like fonts to think about as well.

Closes #1455
This commit is contained in:
Damien Elmes 2021-12-14 12:06:00 +10:00
parent 8d90b6b061
commit 46b85d508a

View File

@ -172,7 +172,9 @@ def _handle_local_file_request(request: LocalFileRequest) -> Response:
try: try:
mimetype = _mime_for_path(fullpath) mimetype = _mime_for_path(fullpath)
if os.path.exists(fullpath): if os.path.exists(fullpath):
return flask.send_file(fullpath, mimetype=mimetype, conditional=True) return flask.send_file(
fullpath, mimetype=mimetype, conditional=True, max_age=60 * 60 # type: ignore[call-arg]
)
else: else:
print(f"Not found: {path}") print(f"Not found: {path}")
return flask.make_response( return flask.make_response(