Quantum이라고 불리는 Firefox의 최신 안정 버전 (버전 57)에서 새 탭의 사용자 제어 Top Sites 기능이 변경되었습니다. 이전에는 웹 사이트와 상관없이 부분 스크린 샷의 조잡한 썸네일 만 나타 났으며 제어 할 수 없었습니다. 이제 일부 웹 사이트는 큰 아이콘으로 표시되고 다른 웹 사이트는 위에서 언급 한 축소판 그림으로 표시되고 파비콘이 모서리에 겹쳐 표시됩니다. 큰 아이콘으로 처리되는 사이트 예 : Amazon, TechCrunch, Slack 및 GitHub. 파비콘 처리로 썸네일을 얻는 사이트 예 : Slashdot, Steam, Kongregate, Gizmodo.
내가 알 수있는 한, 이것에 대한 특별한 운율이나 이유가 없습니다. 또한 최상위 사이트 기능의 어느 곳에서도 설명서를 찾지 못했습니다.
Firefox 소스 코드를 잠시 동안 파고 들자이 코드 browser\extensions\activity-stream\lib\TopSitesFeed.jsm
섹션이 있습니다.
/**
* Get an image for the link preferring tippy top, rich favicon, screenshots.
*/
async _fetchIcon(link) {
// Check for tippy top icon and rich icon.
this._tippyTopProvider.processSite(link);
let hasTippyTop = !!link.tippyTopIcon;
let hasRichIcon = link.favicon && link.faviconSize >= MIN_FAVICON_SIZE;
if (!hasTippyTop && !hasRichIcon) {
this._requestRichIcon(link.url);
}
// Request a screenshot if needed.
if (!hasTippyTop && !hasRichIcon && !link.screenshot) {
const {url} = link;
await Screenshots.maybeCacheScreenshot(link, url, "screenshot",
screenshot => this.store.dispatch(ac.BroadcastToContent({
data: {screenshot, url},
type: at.SCREENSHOT_UPDATED
})));
}
}
이전에는 MIN_FAVICON_SIZE
96으로 정의되었으며 픽셀로 가정합니다.
를 살펴보면 TippyTop
Amazon, Reddit, Twitter, Facebook 및 기타 웹 사이트 ( resource://activity-stream/data/content/tippytop/
관련 JSON 파일 + 이미지에 대해 Firefox 내부 방문)에 대해 우선 처리가 이루어집니다 .Firefox에는 최종 바이너리가있는 특수 아이콘이 포함되어 있음을 의미합니다 특정 웹 사이트이지만 내가 언급 한 모든 사이트가 아닙니다.
예를 들어 TechCrunch는 TippyTop 목록에 없으며 16x16 파비콘 만 있습니다. 그러나 Firefox는 스크린 샷 대신 아이콘을 표시합니다. TechCrunch 웹 사이트에는 96 픽셀을 초과하는 Apple touch 아이콘이 있습니다. 아마도 그 중 하나가 대신 사용됩니다. 나는 일반적으로 파비콘이 애플 고유의 터치 아이콘 메타 태그와 별개의 엔티티라고 생각합니다. 이는 웹 마스터가 스크린 샷 작성 메커니즘을 무시하고 (어떻게 든) 최상위 사이트 목록에 멋진 아이콘을 표시 할 수 있음을 의미합니다. 그래서 어떻게 그렇게 할 수 있는지에 대한 질문이 여전히 남아 있습니까? 이 시점에서 파비콘 논리는 여전히 미스터리입니다.