렌더 병목 2곳 제거: 헤더 backdrop-blur + 전역 배경 transition
프로미스나인과 비교 분석 결과 메이플에만 있는 두 가지 무거운 패턴. - Layout 헤더의 backdrop-blur-md 제거하고 불투명 배경(var(--bg-from))으로 교체. sticky 헤더 아래 컨텐츠가 애니메이션될 때마다 frosted glass 필터를 매 프레임 재계산하던 비용 제거 (fromis_9는 shadow-sm만 사용). - html/body/#root의 background-color/image 500ms transition 제거. 테마 전환 부드럽게 하려는 의도였지만 범위가 전역이라 페이지 렌더 성능 발목을 잡음. 테마 토글은 이제 즉시 전환. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
6e2159cf67
commit
669b358460
2 changed files with 2 additions and 4 deletions
|
|
@ -230,9 +230,10 @@ export default function Layout() {
|
|||
style={{ color: 'var(--text-strong)' }}
|
||||
>
|
||||
<header
|
||||
className="sticky top-0 z-20 border-b backdrop-blur-md shrink-0"
|
||||
className="sticky top-0 z-20 border-b shrink-0"
|
||||
style={{
|
||||
borderColor: 'var(--header-border)',
|
||||
background: 'var(--bg-from)',
|
||||
}}
|
||||
>
|
||||
<div className="mx-auto flex max-w-[1400px] items-center justify-between px-6 py-4">
|
||||
|
|
|
|||
|
|
@ -319,9 +319,6 @@ html, body, #root {
|
|||
background-color: var(--bg-from);
|
||||
background-image: linear-gradient(to bottom right, var(--bg-from), var(--bg-via), var(--bg-to));
|
||||
background-attachment: fixed;
|
||||
transition:
|
||||
background-color 500ms cubic-bezier(0.4, 0, 0.2, 1),
|
||||
background-image 500ms cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
html {
|
||||
overscroll-behavior-y: contain;
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue