예제로 격파하는 코틀린
Hatemogi
Next.js Image 컴포넌트에서 width와 height를 필수로 지정해야 하는 이유는 성능 최적화와 관련이 있습니다.
이미지 파일은 다른 리소스와 달리 렌더링 시간이 비교적 길어질 수 있습니다. 그래서 이미지 크기를 지정하지 않으면 브라우저가 이미지를 로드하기 전에 이미지가 차지할 공간을 계산하는 데 더 많은 시간이 걸리게 됩니다.
하지만 이미지의 크기를 미리 지정해놓으면 브라우저가 이미지의 크기를 먼저 알아내고, 이미지를 로드하기 전에 이미지가 차지할 공간을 계산할 수 있게 됩니다. 이를 통해 브라우저의 렌더링 성능을 향상시킬 수 있습니다.
또한 Next.js Image 컴포넌트에서 layout=fill 속성을 사용하는 경우에는 이미지가 부모 요소의 크기와 일치하도록 렌더링됩니다. 따라서 이미지의 크기를 미리 지정하지 않아도 됩니다. 하지만 이 경우에도 이미지가 로드되기 전에 브라우저가 이미지가 차지할 공간을 미리 계산할 수 있어야 합니다.
이러한 이유로 Next.js Image 컴포넌트에서는 width와 height를 필수로 입력하거나, layout=fill 속성을 사용하여 이미지 크기를 미리 지정하는 것이 좋습니다.
다음 내용이 궁금하다면?
이미 회원이신가요?
2023년 3월 30일 오전 10:35
댓글 0
함께 읽은 게시물
✍️ 오늘은 PM이 읽어볼만한 책을 한 권 소개해드릴까 해요. 스스로의 동기부여가 어려운 분들이나, 동료를 설득해야되는 PM이나, 조직에 자발적 활력을 만들어내고 싶은 조직장 모두가 읽어볼만한 책입니다.
—
📖 <스타트 위드 와이: 나는 왜 이 일을 하는가>
🔖 이성적 범주에 속하는 WHAT은 WHY에서 느껴지는 감정을 겉으로 보여주는 근거 역할을 한다. 어떤 직감으로 결정을 내렸는지 말로 표현할 수 있고 자신의 WHY를 명확히 설명할 수 있으면 주변 사람들에게 결정을 내린 이유를 분명히 이해시킬 수 있다. 이 결정이 객관적인 사실이나 수치와 일관성을 이룬다면 근거은 더욱 타당해진다. 이것이 바로 균형이다. (129p)
—
PM으로 일하면서 가장 어려운 일이 무엇이냐고 물어보면, 대부분 why를 조직장이나 동료들에게 설득하는 과정을 원탑으로 꼽을 겁니다. 문제를 정확히 정의하고, 논리를 만드는 것도 어렵고, 그것을 말이나 글로 표현해 내는 것도 어렵죠.
그래서 프로젝트 문서에 정량적인 데이터 분석을 수반하고, 숫자를 통해 프로젝트의 공감대를 형성하려고 시도할 때가 생깁니다. 하지만 Why에 대해 본인이 충... 더 보기
-
예제로 뿌수는 코틀린 Kotlin 프로그래밍 76제
안드로이드 네이티브 앱 개발의 표준 언어이자, 최근 백엔드 개발에도 공격적으로 활용되고 있는 코틀린 프로그래밍 언어를 다양한 예제를 통해 배울 수 있는 온라인 학습 사이트를 공개합니다.
코틀린 공식 홈페이지에 있는 Kotlin By Example이라는 자료는 편역해서 구성했어요. 저는 NHN에 근무할 때 코틀린을 백엔드 API서버 개발에 활용한 경험이 있는데, 자바로 개발할 때보다 훨씬 편하고 즐거웠던 게 기억에 남았습니다.
코틀린을 배우시려거나, 이미 쓰고 있는데 궁금한 점이 많으셨던 분들에게 유용한... 더 보기
실력 향상을 위한 해외 유튜브 채널 10개
취업 준비와 코딩 공부할 때 도움 되는 해외 유튜브 채널 10개를 간략하게 소개합니다.
1. Gaurav Sen: https://www.youtube.com/@gkcs
- 전반적인 개발자 성장(특히 주니어와 시니어), 취업, 코딩 공부 노하우
- 시스템 설계의 기초 개념 설명 영상이 많다. 특정 시스템 설계를 분석하거나 모의 면접하는 영상이 꽤 많지만 개인적으로 설명이 겉도는 느낌이 있다
- 주니어+/중니어+에게 특화된 취업 및 공부 노하우
2. Abdul Bari(컴공 전공, 알고리즘 공부 필수 채널): https:... 더 보기
Next.js 까보기: "쓸 줄 아는 개발자"에서 "알고 쓰는 개발자로" 강의를
... 더 보기
