feat(js): force page reload to prevent stale data from bfcache

The unread page may show outdated entries when navigating back from an article, due to Chrome's back/forward cache (bfcache) restoring the page from memory.

Reference: https://web.dev/articles/bfcache

internal/template/templates/common/layout.html

@@ -63,7 +63,10 @@
     data-webauthn-login-finish-url="{{ route "webauthnLoginFinish" }}"
     data-webauthn-delete-all-url="{{ route "webauthnDeleteAll" }}"
     {{ end }}
-    {{ if .user }}{{ if not .user.KeyboardShortcuts }}data-disable-keyboard-shortcuts="true"{{ end }}{{ end }}>
+    {{ if .user }}
+        {{ if not .user.KeyboardShortcuts }}data-disable-keyboard-shortcuts="true"{{ end }}
+        data-mark-as-read-on-view="{{ if .user.MarkReadOnView }}true{{ else }}false{{ end }}"
+    {{ end }}>
 
     {{ if .user }}
     <a class="skip-to-content-link" href="#main">{{ t "skip_to_content" }}</a>

internal/ui/static/js/app.js

@@ -1268,3 +1268,10 @@ initializeKeyboardShortcuts();
 initializeTouchHandler();
 initializeClickHandlers();
 initializeServiceWorker();
+
+// Reload the page if it was restored from the back-forward cache and mark entries as read is enabled.
+window.addEventListener("pageshow", (event) => {
+    if (event.persisted && document.body.dataset.markAsReadOnView === "true") {
+        location.reload();
+    }
+});