pile·
프론트엔드·뱅크샐러드뱅크샐러드·

지연 시간 없이 웹폰트 서빙하기 - Feat. Safari & Edge functions

문제웹폰트 로딩 지연으로 사용자 경험이 저하됐고, Safari는 preload가 정상 동작하지 않아 동일 파일을 중복 다운로드했다.
접근Subset 폰트로 원본의 70%를 줄이고 link rel preload로 CSS와 폰트를 병렬 로드했다. CloudFront Functions로 Origin 헤더를 조작해 Safari의 CORS 캐시 재사용을 강제했다.
결과Safari를 포함한 모든 브라우저에서 일관된 폰트 로딩 성능을 확보했다. 브라우저 구현 차이는 edge function으로 보완할 수 있음을 검증했다.
뱅크샐러드
뱅크샐러드 블로그
원문은 여기서 이어서 읽을 수 있어요
원문 읽기
읽음 (0)

이 글과 비슷한

  1. 프론트엔드·LINE EngineeringLINE Engineering·

    AI로 웹 엔지니어 없이 LINE 앱 안에서 그룹 영상 통화 서비스 만들기

    LINE Planet 팀의 PM과 Android 엔지니어 두 명이 웹 전문 엔지니어 없이 LINE 앱 내에서 그룹 영상 통화 서비스를 개발한 과정을 다룬다. LIFF(LINE Front-end Framework)와 LINE Planet SDK를 활용해 React/Vite 기반 웹 앱을 구성했고, Firebase Cloud Functions로 별도 서버 인프라 없이 구현을 완료했다.

    #react#webrtc#firebase+2