itube-specs 0.0.971 → 0.0.972

package/composables/use-test-model-images.ts

@@ -9,26 +9,25 @@ export interface ITestModelPortrait {
 const PORTRAIT_COUNT = 16;
 
 /**
- * Тестовые портреты моделей из `public/img/models/`. Везде один файл 640w:
+ * Тестовые портреты моделей из `public/img/models/`. `?img=png` отдаёт исходники для
+ * сравнения, без параметра — нарезку: avif через `<picture>`, фолбэк webp.
  *
- * - `?img=png` — исходники;
- * - `?img=webp` — только webp, без avif-ветки;
- * - без параметра — avif q63 4:4:4 через `<picture>`, фолбэк webp `-q 85 -m 6 -pass 10 -sharp_yuv`.
+ * Две ширины, выбирает их КОМПОНЕНТ, а не браузер: srcset мы не ставим. 640w идёт в карточку
+ * сетки, 300w во всё мелкое — круглые аватары, мини-карточки, подсказки поиска. Качество
+ * везде одно: webp q85 / avif q63.
  *
- * Две ширины: 640w в карточку сетки и 300w во всё мелкое — круглые аватары, мини-карточки,
- * подсказки поиска. 300w закрывает их с запасом даже при DPR3 (круглому нужно 288) и весит
- * 8.5 KB против 40.6 у полного файла. Выбирает не браузер, а компонент: srcset мы не ставим.
- *
- * Качество ступеней подобрано по равной ошибке в высоких частотах: webp q85 даёт 0.00405,
- * avif q63 — 0.00399. Вес при этом 645 против 434 KB на 16 картинок, то есть avif легче на
- * треть при том же качестве. Разрыв держится на всём диапазоне, от точки не зависит.
- *
- * Один файл, а НЕ ступени через srcset. Исходники 640, слот карточки максимум 297 CSS, так
- * что 640w закрывает любое устройство вплоть до DPR3. Ступень мельче слота при этом заведомо
- * хуже полного файла: её портит двойной пересчёт (наш ресайз плюс браузерный), а её артефакты
+ * Ступеней через srcset НЕ делаем. Исходники 640, слот карточки максимум 297 CSS, так что
+ * 640w закрывает любое устройство вплоть до DPR3. Ступень мельче слота при этом заведомо хуже
+ * полного файла: её портит двойной пересчёт (наш ресайз плюс браузерный), а её артефакты
  * показываются почти 1:1, тогда как 640w в том же слоте ужимается в 2.6 раза и они
- * размазываются. Проверено на DPR1-мониторе: ладдер мылит, один файл нет. Ступени станут
- * осмысленны, только если исходники вырастут заметно выше 640.
+ * размазываются. Проверено на DPR1-мониторе: ладдер мылит, один файл нет.
+ *
+ * На мелкой ступени при разглядывании видна лёгкая разница с исходником, и это не брак
+ * генерации. Кажется, что при слоте 96px и файле 300w запас трёхкратный, но браузер уменьшает
+ * через мип-уровни делением пополам: реально показывается уровень 150, то есть уменьшение
+ * всего в 1.5 раза, и артефакты сжатия почти не размываются. Полностью лечится только отдачей
+ * туда полного 640w — на глаз идеально, но 27 KB на аватар 48–96px перебор, плюс Lighthouse
+ * справедливо ругается на такой перерасход. Осознанный размен.
  *
  * Кроп под 3:4 не делаем — обрезает `object-fit`. Почему именно так, см. `IModelImageUrls`.
  *
@@ -36,21 +35,21 @@ const PORTRAIT_COUNT = 16;
  * по query. Для замера сети это и нужно: он честен только с чистого захода.
  */
 export function useTestModelImages() {
-  const format = useRoute().query['img'];
+  const isSource = useRoute().query['img'] === 'png';
 
   const portraits: ITestModelPortrait[] = Array.from({ length: PORTRAIT_COUNT }, (_, index) => {
     const base = `/img/models/portrait-${index + 1}`;
 
-    if (format === 'png') {
+    if (isSource) {
       return { primaryImageUrl: `${base}.png`, thumbUrl: `${base}.png` };
     }
 
     return {
-      primaryImageUrl: `${base}-q85.webp`,
-      thumbUrl: `${base}-300-q85.webp`,
-      primaryImageSmallUrl: `${base}-300-q85.webp`,
-      primaryImageAvifUrl: format === 'webp' ? undefined : `${base}-q63.avif`,
-      primaryImageSmallAvifUrl: format === 'webp' ? undefined : `${base}-300-q63.avif`,
+      primaryImageUrl: `${base}-640.webp`,
+      thumbUrl: `${base}-300.webp`,
+      primaryImageSmallUrl: `${base}-300.webp`,
+      primaryImageAvifUrl: `${base}-640.avif`,
+      primaryImageSmallAvifUrl: `${base}-300.avif`,
     };
   });
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "itube-specs",
   "type": "module",
-  "version": "0.0.971",
+  "version": "0.0.972",
   "main": "./nuxt.config.ts",
   "types": "./types/index.d.ts",
   "scripts": {