android: the library's file stats on the cards, the artist's own plays, the thumbnail prewarm

The desktop Library's per-record file stats on the phone (library_album_stats,
one call for the whole library): FLAC 24/96 or MP3 320k badges on the cards,
the size on the list rows and the record page. The artist page's own
listening (artist_play_stats): the time played as a chip, the most played
track under "On this phone". The whole-library thumbnail warm a moment after
boot, at the cards' edge, one decode at a time behind the tiles' gate.

src/mobile/screens/Library.svelte

@@ -8,7 +8,8 @@
     import Tracks from "./Tracks.svelte";
     import PlaylistShelf from "../PlaylistShelf.svelte";
     import * as api from "../../lib/api.js";
-    import { lib, artists, isFollowed, followedEntry } from "../lib.svelte.js";
+    import { lib, artists, isFollowed, followedEntry, statLabel } from "../lib.svelte.js";
+    import { fmtBytes } from "../util.js";
     import { push, go, patch, openHalf } from "../nav.svelte.js";
     import { looseTitle, yearOf } from "../catalog.svelte.js";
     import { isUpcoming } from "../disco.js";
@@ -110,14 +111,14 @@
     {:else if view === "grid"}
         <div class="grid2">
             {#each list as a (a.id)}
-                <Release title={a.title} sub={sort === "year" ? String(a.year || "") : a.artist} path={a.art_path} onclick={() => push("album", { id: a.id }, screenEl)} onmore={() => openHalf("album", { album: a })} />
+                <Release title={a.title} sub={sort === "year" ? String(a.year || "") : a.artist} path={a.art_path} badge={statLabel(lib.stats[a.id]) || null} onclick={() => push("album", { id: a.id }, screenEl)} onmore={() => openHalf("album", { album: a })} />
             {/each}
         </div>
     {:else}
         {#each list as a (a.id)}
             <button class="row" onclick={() => push("album", { id: a.id }, screenEl)} oncontextmenu={(e) => { e.preventDefault(); openHalf("album", { album: a }); }}>
                 <span class="art"><Cover path={a.art_path} size={20} /></span>
-                <span class="b"><span class="t">{a.title}</span><span class="m">{a.artist} · {a.year ?? "—"}</span></span>
+                <span class="b"><span class="t">{a.title}</span><span class="m">{a.artist} · {a.year ?? "—"}{statLabel(lib.stats[a.id]) ? " · " + statLabel(lib.stats[a.id]) : ""}{lib.stats[a.id]?.bytes ? " · " + fmtBytes(lib.stats[a.id].bytes) : ""}</span></span>
                 <span class="r"><Icon name="chevron-right" size={17} /></span>
             </button>
         {/each}