Max Potential First Input Delay
240 ms
The maximum potential First Input Delay that your users could experience is the duration of the longest task. Learn more about the Maximum Potential First Input Delay metric.
正文
530
操作候选
0
图片
12
HTML
743 KB
Tailwind
移动端模拟 · 性能评分
2026-09-13 · 实验室数据,非真实用户体验数据。
移动端模拟 · 实验室数据,非真实用户体验数据
2026-09-13T01:13:31.398Z · Lighthouse 13.4.1
分数会受服务器、网络和测试环境影响,独立于品味/转化评分。诊断保留 Lighthouse 原文。
240 ms
The maximum potential First Input Delay that your users could experience is the duration of the longest task. Learn more about the Maximum Potential First Input Delay metric.
2.5 s
Time to Interactive is the amount of time it takes for the page to become fully interactive. Learn more about the Time to Interactive metric.
10.2 s
Consider reducing the time spent parsing, compiling and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to minimize main-thread work
{
"type": "table",
"items": [
{
"group": "other",
"duration": 7611.975999999822,
"groupLabel": "Other"
},
{
"group": "scriptEvaluation",
"duration": 1217.4839999999917,
"groupLabel": "Script Evaluation"
},
{
"group": "styleLayout",
"duration": 715.4680000000006,
"groupLabel": "Style & Layout"
},
{
"group": "paintCompositeRender",
"duration": 411.85600000005087,
"groupLabel": "Rendering"
},
{
"group": "parseHTML",
"duration": 136.86800000000002,
"groupLabel": "Parse HTML & CSS"
},
{
"group": "garbageCollection",
"duration": 55.83200000000004,
"groupLabel": "Garbage Collection"
},
{
"group": "scriptParseCompile",
"duration": 20.931999999999995,
"groupLabel": "Script Parsing & Compilation"
}
],
"headings": [
{
"key": "groupLabel",
"label": "Category",
"valueType": "text"
},
{
"key": "duration",
"label": "Time Spent",
"valueType": "ms",
"granularity": 1
}
],
"sortedBy": [
"duration"
]
}Visible text labels that do not match the accessible name can result in a confusing experience for screen reader users. Learn more about accessible names.
{
"type": "table",
"items": [
{
"node": {
"lhId": "1-0-A",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,0,SECTION,2,DIV,2,SECTION,3,DIV,0,A",
"type": "node",
"snippet": "<a class=\"cta hero-store-cta\" href=\"https://apps.apple.com/app/apple-store/id6764543664?pt=128838980&ct=websit…\" aria-label=\"Download on the App Store. Free, no ads.\" data-analytics-event=\"app_store_cta_clicked\" data-analytics-lang=\"en\" data-analytics-page=\"/\" data-analytics-location=\"hero\" data-analytics-campaign=\"website_home_v1_en\">",
"selector": "div.shell > section.copy > div.actions > a.cta",
"nodeLabel": "FREE, NO ADS\nDownload on the App Store",
"explanation": "Fix any of the following:\n Text inside the element is not included in the accessible name",
"boundingRect": {
"top": 545,
"left": 29,
"right": 281,
"width": 252,
"bottom": 599,
"height": 54
}
}
},
{
"node": {
"lhId": "1-1-A",
"path": "1,HTML,1,BODY,0,DIV,1,FOOTER,0,DIV,0,DIV,1,NAV,5,A",
"type": "node",
"snippet": "<a class=\"language-switch\" href=\"/zh/\" hreflang=\"zh-CN\" lang=\"zh-CN\" aria-label=\"切换到中文\">",
"selector": "div.footer-cover-inner-v01 > div.footer-cover-main-v01 > nav.footer-links-v01 > a.language-switch",
"nodeLabel": "简体中文",
"explanation": "Fix any of the following:\n Text inside the element is not included in the accessible name",
"boundingRect": {
"top": 5677,
"left": 111,
"right": 200,
"width": 89,
"bottom": 5707,
"height": 30
}
}
}
],
"headings": [
{
"key": "node",
"label": "Failing Elements",
"valueType": "node",
"subItemsHeading": {
"key": "relatedNode",
"valueType": "node"
}
}
],
"debugData": {
"tags": [
"cat.semantics",
"wcag21a",
"wcag253",
"EN-301-549",
"EN-9.2.5.3",
"RGAAv4",
"RGAA-6.1.5",
"experimental"
],
"type": "debugdata",
"impact": "serious"
}
}Total size was 3,604 KiB
Large network payloads cost users real money and are highly correlated with long load times. Learn how to reduce payload sizes.
{
"type": "table",
"items": [
{
"url": "https://slides.by331.net/assets/fourth-v09/screen4-door-light-bg-final-3840x2160-q90.webp",
"totalBytes": 954379
},
{
"url": "https://slides.by331.net/assets/hero-webp/photo-04.webp",
"totalBytes": 303471
},
{
"url": "https://slides.by331.net/assets/third-v69/W68-BG-C-01_selected_bottom_right_wall_rebuild_preview_2048.webp",
"totalBytes": 259807
},
{
"url": "https://slides.by331.net/assets/hero-webp/photo-03.webp",
"totalBytes": 251574
},
{
"url": "https://slides.by331.net/assets/hero-webp/photo-02.webp",
"totalBytes": 234946
},
{
"url": "https://slides.by331.net/assets/third-v712/frame_final_transparent.webp",
"totalBytes": 224638
},
{
"url": "https://slides.by331.net/assets/third-v755/people_9x6_full_bleed_inset14.webp",
"totalBytes": 191971
},
{
"url": "https://slides.by331.net/assets/hero-ultrawide/hero-ultrawide-foreground.webp",
"totalBytes": 177517
},
{
"url": "https://slides.by331.net/assets/fourth-v09/screen4-tyndall-overlay-square-v3.webp",
"totalBytes": 133510
},
{
"url": "https://slides.by331.net/assets/third-v737/album_9x6_clean_photo.webp",
"totalBytes": 122746
}
],
"headings": [
{
"key": "url",
"label": "URL",
"valueType": "url"
},
{
"key": "totalBytes",
"label": "Transfer Size",
"valueType": "bytes"
}
],
"sortedBy": [
"totalBytes"
]
}Est savings of 16 KiB
A long cache lifetime can speed up repeat visits to your page. Learn more about caching.
{
"type": "table",
"items": [
{
"url": "https://static.cloudflareinsights.com/beacon.min.js",
"totalBytes": 10338,
"wastedBytes": 4135.2,
"cacheLifetimeMs": 86400000
},
{
"url": "https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495",
"totalBytes": 10338,
"wastedBytes": 4135.2,
"cacheLifetimeMs": 86400000
},
{
"url": "https://static.cloudflareinsights.com/beacon.min.js",
"totalBytes": 10188,
"wastedBytes": 4075.2000000000003,
"cacheLifetimeMs": 86400000
},
{
"url": "https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495",
"totalBytes": 10188,
"wastedBytes": 4075.2000000000003,
"cacheLifetimeMs": 86400000
}
],
"headings": [
{
"key": "url",
"label": "Request",
"valueType": "url"
},
{
"key": "cacheLifetimeMs",
"label": "Cache TTL",
"valueType": "ms",
"displayUnit": "duration"
},
{
"key": "totalBytes",
"label": "Transfer Size",
"valueType": "bytes",
"displayUnit": "kb",
"granularity": 1
}
],
"sortedBy": [
"wastedBytes"
],
"debugData": {
"type": "debugdata",
"wastedBytes": 16420.8
},
"skipSumming": [
"cacheLifetimeMs"
]
}Est savings of 1,303 KiB
Reducing the download time of images can improve the perceived load time of the page and LCP. Learn more about optimizing image size
{
"type": "table",
"items": [
{
"url": "https://slides.by331.net/assets/hero-webp/photo-04.webp",
"node": {
"lhId": "page-1-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,DIV,4,SECTION,0,DIV,0,DIV,2,IMG",
"type": "node",
"snippet": "<img class=\"curtain-download-slide-v01\" src=\"/assets/hero-webp/photo-04.webp\" alt=\"\" decoding=\"async\" loading=\"lazy\">",
"selector": "section#before-download > div.curtain-download-photo-v01 > div.curtain-download-device-v01 > img.curtain-download-slide-v01",
"nodeLabel": "section#before-download > div.curtain-download-photo-v01 > div.curtain-download-device-v01 > img.curtain-download-slide-v01",
"boundingRect": {
"top": 4154,
"left": 221,
"right": 380,
"width": 159,
"bottom": 4498,
"height": 344
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "Increasing the image compression factor could improve this image's download size.",
"wastedBytes": 240497
},
{
"reason": "This image file is larger than it needs to be (416x900) for its displayed dimensions (459x344). Use responsive images to reduce the image download size.",
"wastedBytes": 175163
}
]
},
"totalBytes": 302850,
"wastedBytes": 276561
},
{
"url": "https://slides.by331.net/assets/hero-webp/photo-03.webp",
"node": {
"lhId": "page-2-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,DIV,4,SECTION,0,DIV,0,DIV,1,IMG",
"type": "node",
"snippet": "<img class=\"curtain-download-slide-v01\" src=\"/assets/hero-webp/photo-03.webp\" alt=\"\" decoding=\"async\" loading=\"lazy\">",
"selector": "section#before-download > div.curtain-download-photo-v01 > div.curtain-download-device-v01 > img.curtain-download-slide-v01",
"nodeLabel": "section#before-download > div.curtain-download-photo-v01 > div.curtain-download-device-v01 > img.curtain-download-slide-v01",
"boundingRect": {
"top": 4154,
"left": 221,
"right": 380,
"width": 159,
"bottom": 4498,
"height": 344
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "Increasing the image compression factor could improve this image's download size.",
"wastedBytes": 188659
},
{
"reason": "This image file is larger than it needs to be (416x900) for its displayed dimensions (459x344). Use responsive images to reduce the image download size.",
"wastedBytes": 145181
}
]
},
"totalBytes": 251012,
"wastedBytes": 224723
},
{
"url": "https://slides.by331.net/assets/hero-webp/photo-02.webp",
"node": {
"lhId": "page-3-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,DIV,4,SECTION,0,DIV,0,DIV,0,IMG",
"type": "node",
"snippet": "<img class=\"curtain-download-slide-v01\" src=\"/assets/hero-webp/photo-02.webp\" alt=\"\" decoding=\"async\" loading=\"lazy\">",
"selector": "section#before-download > div.curtain-download-photo-v01 > div.curtain-download-device-v01 > img.curtain-download-slide-v01",
"nodeLabel": "section#before-download > div.curtain-download-photo-v01 > div.curtain-download-device-v01 > img.curtain-download-slide-v01",
"boundingRect": {
"top": 4154,
"left": 221,
"right": 380,
"width": 159,
"bottom": 4498,
"height": 344
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "Increasing the image compression factor could improve this image's download size.",
"wastedBytes": 184998
},
{
"reason": "This image file is larger than it needs to be (370x800) for its displayed dimensions (516x344). Use responsive images to reduce the image download size.",
"wastedBytes": 93748
}
]
},
"totalBytes": 234300,
"wastedBytes": 204725
},
{
"url": "https://slides.by331.net/assets/fourth-v09/screen4-tyndall-overlay-square-v3.webp",
"node": {
"lhId": "page-4-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,DIV,2,SECTION,1,DIV,0,PICTURE,1,IMG",
"type": "node",
"snippet": "<img src=\"https://slides.by331.net/assets/fourth-v09/screen4-tyndall-overlay-square-…\" alt=\"\" decoding=\"async\" loading=\"lazy\">",
"selector": "section#shared-screen > div.shared-poster-motion-v09 > picture.shared-tyndall-overlay-v09 > img",
"nodeLabel": "section#shared-screen > div.shared-poster-motion-v09 > picture.shared-tyndall-overlay-v09 > img",
"boundingRect": {
"top": 2478,
"left": 15,
"right": 397,
"width": 382,
"bottom": 3163,
"height": 685
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (1606x2880) for its displayed dimensions (678x678). Use responsive images to reduce the image download size.",
"wastedBytes": 119705
}
]
},
"totalBytes": 132918,
"wastedBytes": 119705
},
{
"url": "https://slides.by331.net/assets/hero-fill-webp/tv-card-04.webp",
"node": {
"lhId": "page-5-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,SECTION,4,ARTICLE,0,DIV,0,IMG",
"type": "node",
"snippet": "<img src=\"assets/hero-fill-webp/tv-card-04.webp\" alt=\"\" fetchpriority=\"high\" decoding=\"async\">",
"selector": "section.screen-layer > article.card > div.photo > img",
"nodeLabel": "section.screen-layer > article.card > div.photo > img",
"boundingRect": {
"top": 241,
"left": 201,
"right": 265,
"width": 64,
"bottom": 359,
"height": 118
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (700x1029) for its displayed dimensions (238x357). Use responsive images to reduce the image download size.",
"wastedBytes": 77731
}
]
},
"totalBytes": 88122,
"wastedBytes": 77731
},
{
"url": "https://slides.by331.net/assets/scenes-webp/living_tv_single_photo_v414.webp",
"node": {
"lhId": "page-5-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,DIV,0,SECTION,0,DIV,1,DIV,0,ARTICLE,0,IMG",
"type": "node",
"snippet": "<img loading=\"eager\" decoding=\"async\" src=\"/assets/scenes-webp/living_tv_single_photo_v414.webp\" alt=\"Living room TV playing Immich photos\">",
"selector": "div.section-pad > div.scene-mosaic-v40 > article.scene-card > img",
"nodeLabel": "Living room TV playing Immich photos",
"boundingRect": {
"top": 1094,
"left": 40,
"right": 372,
"width": 332,
"bottom": 1418,
"height": 324
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (1024x999) for its displayed dimensions (332x332). Use responsive images to reduce the image download size.",
"wastedBytes": 76703
}
]
},
"totalBytes": 85962,
"wastedBytes": 76703
},
{
"url": "https://slides.by331.net/assets/scenes-webp/ipad_desk_single_photo_v414.webp",
"node": {
"lhId": "page-6-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,DIV,0,SECTION,0,DIV,1,DIV,2,ARTICLE,0,IMG",
"type": "node",
"snippet": "<img loading=\"lazy\" decoding=\"async\" src=\"/assets/scenes-webp/ipad_desk_single_photo_v414.webp\" alt=\"iPad playing photos on a shelf or desk\">",
"selector": "div.section-pad > div.scene-mosaic-v40 > article.scene-card > img",
"nodeLabel": "iPad playing photos on a shelf or desk",
"boundingRect": {
"top": 1430,
"left": 212,
"right": 372,
"width": 160,
"bottom": 1596,
"height": 166
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (987x1024) for its displayed dimensions (166x166). Use responsive images to reduce the image download size.",
"wastedBytes": 73393
}
]
},
"totalBytes": 75450,
"wastedBytes": 73393
},
{
"url": "https://slides.by331.net/assets/scenes-webp/iphone_bedside_single_photo_v414.webp",
"node": {
"lhId": "page-7-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,DIV,0,SECTION,0,DIV,1,DIV,1,ARTICLE,0,IMG",
"type": "node",
"snippet": "<img loading=\"lazy\" decoding=\"async\" src=\"/assets/scenes-webp/iphone_bedside_single_photo_v414.webp\" alt=\"Spare iPhone playing photos on a nightstand\">",
"selector": "div.section-pad > div.scene-mosaic-v40 > article.scene-card > img",
"nodeLabel": "Spare iPhone playing photos on a nightstand",
"boundingRect": {
"top": 1430,
"left": 40,
"right": 200,
"width": 160,
"bottom": 1596,
"height": 166
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (987x1024) for its displayed dimensions (166x166). Use responsive images to reduce the image download size.",
"wastedBytes": 64385
}
]
},
"totalBytes": 66190,
"wastedBytes": 64385
},
{
"url": "https://slides.by331.net/assets/hero-fill-webp/tv-card-03.webp",
"node": {
"lhId": "page-6-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,SECTION,3,ARTICLE,0,DIV,0,IMG",
"type": "node",
"snippet": "<img src=\"assets/hero-fill-webp/tv-card-04.webp\" alt=\"\" fetchpriority=\"high\" decoding=\"async\">",
"selector": "section.screen-layer > article.card > div.photo > img",
"nodeLabel": "section.screen-layer > article.card > div.photo > img",
"boundingRect": {
"top": 184,
"left": 442,
"right": 564,
"width": 122,
"bottom": 337,
"height": 153
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (700x1029) for its displayed dimensions (238x357). Use responsive images to reduce the image download size.",
"wastedBytes": 61194
}
]
},
"totalBytes": 69374,
"wastedBytes": 61194
},
{
"url": "https://slides.by331.net/assets/hero-fill-webp/tv-card-01.webp",
"node": {
"lhId": "page-7-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,SECTION,5,ARTICLE,0,DIV,0,IMG",
"type": "node",
"snippet": "<img src=\"assets/hero-fill-webp/tv-card-01.webp\" alt=\"\" fetchpriority=\"high\" decoding=\"async\">",
"selector": "section.screen-layer > article.card > div.photo > img",
"nodeLabel": "section.screen-layer > article.card > div.photo > img",
"boundingRect": {
"top": 227,
"left": 217,
"right": 286,
"width": 69,
"bottom": 352,
"height": 125
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (700x1035) for its displayed dimensions (184x276). Use responsive images to reduce the image download size.",
"wastedBytes": 44713
}
]
},
"totalBytes": 48084,
"wastedBytes": 44713
},
{
"url": "https://slides.by331.net/assets/brand/AppIcon-tvOS-transparent-360.png",
"node": {
"lhId": "page-8-IMG",
"path": "1,HTML,1,BODY,0,DIV,1,FOOTER,0,DIV,0,DIV,0,A,0,IMG",
"type": "node",
"snippet": "<img src=\"/assets/brand/AppIcon-tvOS-transparent-360.png\" alt=\"\" decoding=\"async\" loading=\"lazy\">",
"selector": "div.footer-cover-inner-v01 > div.footer-cover-main-v01 > a.footer-brand-lockup-v01 > img",
"nodeLabel": "div.footer-cover-inner-v01 > div.footer-cover-main-v01 > a.footer-brand-lockup-v01 > img",
"boundingRect": {
"top": 5587,
"left": 18,
"right": 86,
"width": 68,
"bottom": 5625,
"height": 38
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "Using a modern image format (WebP, AVIF) or increasing the image compression could improve this image's download size.",
"wastedBytes": 23618
},
{
"reason": "This image file is larger than it needs to be (360x203) for its displayed dimensions (67x38). Use responsive images to reduce the image download size.",
"wastedBytes": 34544
}
]
},
"totalBytes": 35798,
"wastedBytes": 35371
},
{
"url": "https://slides.by331.net/assets/hero-fill-webp/tv-card-02.webp",
"node": {
"lhId": "page-8-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,SECTION,2,ARTICLE,0,DIV,0,IMG",
"type": "node",
"snippet": "<img src=\"assets/hero-fill-webp/tv-card-03.webp\" alt=\"\" fetchpriority=\"high\" decoding=\"async\">",
"selector": "section.screen-layer > article.card > div.photo > img",
"nodeLabel": "section.screen-layer > article.card > div.photo > img",
"boundingRect": {
"top": 150,
"left": 341,
"right": 481,
"width": 140,
"bottom": 337,
"height": 187
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (700x896) for its displayed dimensions (236x354). Use responsive images to reduce the image download size.",
"wastedBytes": 32439
}
]
},
"totalBytes": 37426,
"wastedBytes": 32439
},
{
"url": "https://slides.by331.net/assets/hero-fill-webp/ipad-fill.webp",
"node": {
"lhId": "page-9-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,0,SECTION,0,IMG",
"type": "node",
"snippet": "<img src=\"assets/hero-fill-webp/ipad-fill.webp\" alt=\"\" fetchpriority=\"high\" decoding=\"async\">",
"selector": "div.wrap > main.artboard > section.side-screen-fill > img",
"nodeLabel": "div.wrap > main.artboard > section.side-screen-fill > img",
"boundingRect": {
"top": 134,
"left": 5,
"right": 68,
"width": 63,
"bottom": 232,
"height": 98
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (564x848) for its displayed dimensions (141x212). Use responsive images to reduce the image download size.",
"wastedBytes": 23811
}
]
},
"totalBytes": 25398,
"wastedBytes": 23811
},
{
"url": "https://slides.by331.net/assets/fourth-v09/screen4-door-square-mobile.webp",
"node": {
"lhId": "page-9-IMG",
"path": "1,HTML,1,BODY,0,DIV,0,MAIN,1,DIV,2,SECTION,0,PICTURE,2,IMG",
"type": "node",
"snippet": "<img src=\"https://slides.by331.net/assets/fourth-v09/screen4-door-square-mobile.webp\" alt=\"\" decoding=\"async\" loading=\"lazy\">",
"selector": "div.page > section#shared-screen > picture.shared-poster-bg-v09 > img",
"nodeLabel": "div.page > section#shared-screen > picture.shared-poster-bg-v09 > img",
"boundingRect": {
"top": 2481,
"left": 17,
"right": 395,
"width": 378,
"bottom": 3159,
"height": 678
}
},
"subItems": {
"type": "subitems",
"items": [
{
"reason": "This image file is larger than it needs to be (669x1200) for its displayed dimensions (678x678). Use responsive images to reduce the image download size.",
"wastedBytes": 18936
}
]
},
"totalBytes": 44302,
"wastedBytes": 18936
}
],
"headings": [
{
"key": "node",
"label": "",
"valueType": "node"
},
{
"key": "url",
"label": "URL",
"valueType": "url",
"subItemsHeading": {
"key": "reason",
"valueType": "text"
}
},
{
"key": "totalBytes",
"label": "Resource Size",
"valueType": "bytes"
},
{
"key": "wastedBytes",
"label": "Est Savings",
"valueType": "bytes",
"subItemsHeading": {
"key": "wastedBytes",
"valueType": "bytes"
}
}
],
"debugData": {
"type": "debugdata",
"wastedBytes": 1334390
}
}Est savings of 21 KiB
Polyfills and transforms enable older browsers to use new JavaScript features. However, many aren't necessary for modern browsers. Consider modifying your JavaScript build process to not transpile Baseline features, unless you know you must support older browsers. Learn why most sites can deploy ES6+ code without transpiling
{
"type": "table",
"items": [
{
"url": "https://static.cloudflareinsights.com/beacon.min.js",
"subItems": {
"type": "subitems",
"items": [
{
"signal": "Array.prototype.at",
"location": {
"url": "https://static.cloudflareinsights.com/beacon.min.js",
"line": 0,
"type": "source-location",
"column": 19367,
"urlProvider": "network"
}
},
{
"signal": "Array.prototype.findLast",
"location": {
"url": "https://static.cloudflareinsights.com/beacon.min.js",
"line": 0,
"type": "source-location",
"column": 19137,
"urlProvider": "network"
}
}
]
},
"wastedBytes": 10682
},
{
"url": "https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495",
"subItems": {
"type": "subitems",
"items": [
{
"signal": "Array.prototype.at",
"location": {
"url": "https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495",
"line": 0,
"type": "source-location",
"column": 19367,
"urlProvider": "network"
}
},
{
"signal": "Array.prototype.findLast",
"location": {
"url": "https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495",
"line": 0,
"type": "source-location",
"column": 19137,
"urlProvider": "network"
}
}
]
},
"wastedBytes": 10682
}
],
"headings": [
{
"key": "url",
"label": "URL",
"valueType": "url",
"subItemsHeading": {
"key": "location",
"valueType": "source-location"
}
},
{
"key": null,
"label": "",
"valueType": "code",
"subItemsHeading": {
"key": "signal"
}
},
{
"key": "wastedBytes",
"label": "Wasted bytes",
"valueType": "bytes"
}
],
"debugData": {
"type": "debugdata",
"wastedBytes": 21364
}
}Avoid chaining critical requests by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.
{
"type": "list",
"items": [
{
"type": "list-section",
"value": {
"type": "network-tree",
"chains": {
"CF7EA30CFE222CE15CCDA82863E2596C": {
"url": "https://slides.by331.net/",
"children": {
"598887.13": {
"url": "https://slides.by331.net/assets/fonts/signature/Courgette-Regular.ttf",
"children": {},
"transferSize": 49299,
"navStartToEndTime": 2733
},
"598887.14": {
"url": "https://slides.by331.net/site.webmanifest",
"children": {},
"transferSize": 789,
"navStartToEndTime": 2697
},
"598887.38": {
"url": "https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495",
"children": {},
"isLongest": true,
"transferSize": 10188,
"navStartToEndTime": 4336
}
},
"isLongest": true,
"transferSize": 63800,
"navStartToEndTime": 1142
}
},
"longestChain": {
"duration": 4336
}
}
},
{
"type": "list-section",
"title": "Preconnected origins",
"value": {
"type": "text",
"value": "no origins were preconnected"
},
"description": "[preconnect](https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/) hints help the browser establish a connection earlier in the page load, saving time when the first request for that origin is made. The following are the origins that the page preconnected to."
},
{
"type": "list-section",
"title": "Preconnect candidates",
"value": {
"type": "text",
"value": "No additional origins are good candidates for preconnecting"
},
"description": "Add [preconnect](https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/) hints to your most important origins, but try to use no more than 4."
}
]
}{
"finalUrl": "https://slides.by331.net/",
"userAgent": "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/151.0.0.0 Safari/537.36",
"formFactor": "mobile",
"throttlingMethod": "simulate",
"throttling": {
"rttMs": 150,
"throughputKbps": 1638.4,
"requestLatencyMs": 562.5,
"uploadThroughputKbps": 675,
"cpuSlowdownMultiplier": 4,
"downloadThroughputKbps": 1474.5600000000002
},
"metrics": [
{
"id": "largest-contentful-paint",
"unit": "millisecond",
"value": 1467.864
},
{
"id": "cumulative-layout-shift",
"unit": "unitless",
"value": 0.013877381264068008
},
{
"id": "total-blocking-time",
"unit": "millisecond",
"value": 624.5
},
{
"id": "first-contentful-paint",
"unit": "millisecond",
"value": 1399.864
},
{
"id": "speed-index",
"unit": "millisecond",
"value": 9902.185538248179
}
]
}01 / 值得借鉴
暖色环境光、电视机柜与大屏陈列直观展示了作为家庭常驻相框的实际效果,脱离了传统工具软件生硬的技术截图套路。
下载前设置的三项检查清单清晰申明用户必须自备 Immich 服务与 API Key,有效避免了误以为该应用提供云存储或备份功能的用户产生误解。
02 / 下一步
在 390px 视口下,磨砂玻璃文字卡片直接覆盖在电视黑色边框与高亮照片上方,导致大标题与正文对比度混乱且阅读吃力。
在 768px 以下断点将首屏布局调整为单列垂直流,文字容器置顶并采用深色纯净底色,将电视设备插图放置在其下方,消除重叠造成的对比度冲突。
桌面端右下角清晰标有 iPhone、iPad、Apple TV 支持信息,但在移动端该标签被挤出首屏视口,导致用户在点击下载前无法立即获知是否支持电视端。
在所有视口的首屏主卡片中,将紧凑的设备支持标签直接放置于 App Store 下载按钮下方,确保关键支持信息不因屏幕收窄而脱节。
03 / 设计语言
背景
#111111文字
#ffffff表达也可以更准确
Apple TV in the living room, an iPad on a shelf, or a spare iPhone on a nightstand.Connect once, then let your Immich photos play where you will actually see them.
Apple TV in the living room, an iPad on a shelf, or a spare iPhone on a nightstand. Connect once, then let your Immich photos play where you will actually see them.
修复英文句号后缺失的空格,提升文案排版严谨度。04 / 检查依据
逐项查看观察、建议与采集记录。
白色标题文字横跨电视黑色边框与画面高光区域,背景杂乱破坏了排版辨识度与高级感。
在移动端断点解除绝对定位或半透明浮层覆盖,改为先排版文字再在下方渲染电视图解。
FOR YOUR SELF-HOSTED IMMICH LIBRARY. Bring your Immich photos back into view
陌生人落到一个看起来像 AI、没有作者、没有客户、没有联系方式的站点上,不会把邮箱给你。
加上真名、真脸、真实联系方式,或一句真实客户的话。
no about, no first-person, no quote
看不到谁跳出,就不知道下一次修改有没有用。没有计数就等于盲飞。
在公开页放上 Plausible、PostHog 或 GA4。一段脚本就够。
no gtag / plausible / posthog / umami
想买、想问、想投诉的人没有出口。这是转化漏洞,也是信任漏洞。
页脚放一个能用的邮箱、表单,或真实社交账号。一个就够。
no mailto / telegram / x / github / email
没有 alt,读屏到这里就断了,搜索也会减分。装饰图可以 alt="",内容图不行。
产品和照片写短 alt。纯装饰才用空 alt。
9 images without alt
标签、分享卡、首屏各说各的,访客就记不住这是同一个产品。
让 title、og:title 和 H1 共用同一个名词。
title="immichSlides | Immich Slides for Apple TV, iPad & iPhone" h1="Bring yourImmich photosback into view"
没有 Strict-Transport-Security,第一次访问仍可能被降到 http。浏览器不会钉死 HTTPS。
在边缘设置 Strict-Transport-Security: max-age=31536000; includeSubDomains。
strict-transport-security missing
首包超过 350 KB,多半是内联垃圾:整份 CSS、JSON,或整个应用。手机还没看到标题就已经在付钱。
把 CSS 和数据移出文档。首包 HTML 控制在 200 KB 以内。
743 KB HTML
CSP 是限制脚本源的标准做法。vibe 页面常常什么都加载,包括被注入的脚本。
先开 report-only CSP,再收成 default-src 'self' 和明确的 script-src。
content-security-policy missing
英文标点后缺少空格导致两句话粘连,显得排版未经校对。
在源码文案模板中于 'nightstand.' 后添加标准 ASCII 空格。
or a spare iPhone on a nightstand.Connect once, then let your Immich photos play

An independent Immich slideshow app for Apple TV, iPad, and iPhone. Connect your own Immich server URL and API Key; not a cloud photo service.
05 / 开始动手
优化指令用于调整这个页面;设计指令用于借鉴它的视觉语言。「做同款」会附带截图与实施步骤。复制后粘贴到你的代码助手中。
重构营销页面的 Hero 首屏区域,消除移动端的视觉重叠问题并保持桌面端美感。 1. 移动端布局重构: - 在小于 768px 的视口(重点测试 390px)中,取消毛玻璃卡片对电视硬件图的绝对覆盖浮层。 - 将首屏改为自上而下的标准单列流:先显示文本容器(包含小标 'FOR YOUR SELF-HOSTED IMMICH LIBRARY.'、大标题 'Bring your Immich photos back into view'、介绍文案、App Store 下载按钮以及 'Supports: iPhone · iPad · Apple TV' 标签),下方再陈列电视与照片画框图示。 - 确保白色文字与底色之间拥有不低于 4.5:1 的对比度。 2. 文案修正: - 在 'Turn spare screens into photo frames for your home' 模块中,将 'nightstand.Connect once' 修正为带空格的 'nightstand. Connect once'。 3. 完整保留提取的设计系统变量: - 保留背景色 #111111、--bg #f4f1e8、--paper #fffdf7、按钮圆角 999px、卡片圆角 34px 以及 Inter 字体体系。 - 在 1440x900 与 390x844 两个典型分辨率下验证视觉效果。