여러가지 프로젝트를 하면서

수많은 에러를 접하면서 그리고 그 해결과정을 겪으면서, 스스로가 조금 더 성장했단 것에 뿌듯함과 욕심이 더 생기기 시작했다. 처음엔 전공자도 아닌 쩌리가 뭘 할 수 있겠냐는 식의 무시가 싫어서 더 찾아보고 파헤치고 노력했던 건데, 어느순간 '무시'가 '인정'으로 바뀌었을때 쾌감이란 느껴보지 못한 사람들은 절대 모를 희열감을 느꼈다.
그래서 더 노력해야겠다 생각한다. 비전공자이기 때문에 한계가 존재하고 나도 그걸 잘 알고 있기 때문에, 최근에는 원격교육원으로 컴퓨터공학과 수업을 듣기 시작했다. 그렇게 욕심을 부리다보니 어느새 웹 성능최적화 까지 손길이 닿았다.
웹서비스를 제작하면서 제일 힘들었던건.. 솔직히 남들은 다 가지고 있는 기본 개념의 한계였었다. 그게 자꾸 발목을 붙잡고 계속 앞으로 나아가고 싶을때 벽처럼 앞을 가로막고 있었다. 그런 기본개념을 익히고 나니, 무수히 많은 프론트엔드 라이브러리와 프레임워크들의 개념들이 발목을 잡았다. 이쯤되면 스스로가 변태가 아닌가 생각이 들었다. 솔직히 즐기고 있었다.

'뭐 어디까지 있겠어' '누가 이기나 해보자'

여러가지 프레임워크의 발끝을 따라가기도 어려웠다. 근데 변태같이도 그 과정이 재밌다. 뭐 하나를 알게되면, 내가 이전에 만들었던 페이지들을 되돌아보게 되었다. 성장 후에 본 내 페이지는 정말 ㅋㅋㅋ 쓰레기와 다름없었다. 근데 그게 웃기게도 재밌다. 내가 이만큼 성장했다는걸 눈으로 확인하는 순간이였기 때문에!

성능 최적화에 대해

성능최적화를 처음으로 접한건 회사 백엔드 개발자분을 통해서였다. 초창기 무시당하던 그때, 내게 lazy 이미지를 아냐고 물어보셨고, 나는 그 물음에 대답하지 못했다. 너무 분했다. 정말 몰랐지만 모르는게 분했다. 대화가 안되는게 화가났고, 스스로의 무지함이 짜증났다. 그래서 이곳저곳을 뒤져댔지만 대체 이걸 왜 해야하는지에 대한 의문이 생겼다.

'왜 이미지를 일부러 늦게 뜨게하죠?'

그렇게 생각하고, 시간이 지나 여러가지 프로젝트를 경험하고 나서 확실히 느끼게 됐다. '사용자들은 0.1초의 차이를 느끼고, 최적화에 따라 사용빈도가 달라진다'는 것을 말이다. 결국 최적화는 누구보다 빠르게 사이트를 사용자에게 노출시킬 수 있는 것.
결국 이미지의 사이즈를 규격에 맞추고 화면에 나오는 이미지를 '먼저'뜨게 하는 것 자체가 최적화라는 것.
그래서 고민하기 시작했다. 유저의 발목을 더 붙잡기 위해, 나는 무엇을 할 수 있을지

Lighthouse툴 사용하기

물론 성능 최적화에 대한 방법또한 여러가지겠지만 나는 구글 Lighthouse를 이용했다.
앞으로 성능최적화의 대한 기본 개념과 해결점들을 차근차근 올려보려고 한다.

해당 Lighthouse는 활성화하면 이런창이 나타나는데, 기기를 데스크톱과 모바일 두개로 설정해서 보고서 생성을 누르면 해당 사이트의 최적화 정도를 보고서로 볼 수 있다.

해당 검사기를 돌리면 이미지처럼 최적화에 어떤문제가 있는지 나타나는데, 이를 이용해 코드를 수정하고 라이브러리를 더하면 최적화에 특화된 사이트를 만드는것이 가능하다! 대부분의 사이트 최적화 문제는 여러가지 방법으로 잡을 수 있기 때문에, 해당 내용을 보고 조금 더 고민하면 누구나 최적화된 웹사이트를 제작하는것이 가능하다고 생각한다.