rrit
(Ayke)
1
프로필 사진과 게시물 내 이미지 요소는 loading="lazy" 속성이 설정되어 있어 지연 로드(lazy loading)됩니다.
이모지는 이 대상에서 제외됩니다. 
<img src="https://emoji.discourse-cdn.com/twitter/sloth.png?v=12" title=":sloth:" class="emoji" alt=":sloth:">
소스 코드에서 이모지 태그가 생성되는 위치를 찾을 수 없었습니다.
이모지는 게시물에 “구워져서(baked)” 포함되는 건가요?
sam
(Sam Saffron)
3
왜 하드코딩된 너비와 높이를 추가했는지 더 자세히 설명해 주시겠어요? 왜 여기서 우리의 CSS 솔루션이 충분하지 않나요?
rrit
(Ayke)
4
개인적으로, img 요소가 생성되는 지점에서 항상 width와 height 속성을 추가하는 것이 좋은 관례라고 생각합니다. 그 자리에서야 어떤 이미지 파일을 넣는지 정확히 알 수 있기 때문입니다. CSS는 실제 이미지 파일과는 멀리 떨어져 있습니다.
게다가 브라우저는 이미지 파일을 로드하기 전에, 그리고 CSS를 파싱하기 전에 이미지 크기에 대한 이 추가 정보를 사용하여 aspect-ratio를 계산합니다.
이 경우 이모지는 다양한 곳에서 사용되며, 때로는 CSS를 통한 크기 정의를 우연히 건너뛰게 됩니다.
예를 들어 PageSpeed의 이 동일한 주제의 crawler view를 참조하세요.
sam
(Sam Saffron)
5
아, 그러니까 브라우저가 이걸로 종횡비를 파악하는 거군요. 이렇게 하면 CSS에서 더 유연하게 사용할 수 있고, CSS 관련 차단 문제도 제한할 수 있네요. 좋은 것 같습니다. 다만, HTML이 좀 더 길어지는 점은 아쉽네요.
pmusaraj
(Penar Musaraj)
6
이 PR이 이제 병합되었습니다. 기여해 주셔서 감사합니다, @rrit!