이전 글에 이어지는 2번째 웹페이지 성능 이슈를 처리한 방법입니다.

Serve Images in next-gen formats 항목이 나와서 내용을 보니 PNG 또는 JPG를 WebP로 바꾸라는 메시지였습니다. AVIF는 또 뭔 이미지 포맷인가요. 😅

살펴보니 이미지 용량을 15~40% 정도 줄여주는 것으로 보였습니다.

이슈 이미지 목록

 

WebP는 구글에서 미는 이미지라 Safafi 지원이 안되는 것으로 알고 있었는데, 16.0 버전부터 지원이 되네요. 2022/09 월 이후 업데이트한 사파리는 가능할 것으로 보입니다. 뭐, 전 세계의 점유율이 1.34%라고 하고, 또 맥에서도 크롬브라우저 사용이 좋은 편이니, 모두 WebP 로 바꾸지 않을 이유가 없습니다. 1.34%를 위해서 빠른 로딩과 네트워크 비용절약을 포기할 수는 없으니까요.
https://caniuse.com/webp 

caniuse webp

작업을 위해서 webp를 커맨드라인으로 설치하니, cwebp 커맨드라인이 추가되었습니다.

https://www.google.com/search?q=webp+command+line 

 

🔎 webp command line: Google 검색

 

www.google.com

 

그리고 이미지 폴더를 바꾸니 이렇게 변환된 파일들이 생성이 되었습니다. 제가 커스터마이징한 shell 파일은 이 링크에서 볼 수 있습니다.

Converted WebP images

오늘 네트워크가 좋아서 그런지 성능 잘 나오네요.

After:

after WebP transfer

Yesterday:

Yesterday

기술이 발전하는 것을 몸소 느끼는 중입니다. 물론 우여곡절도 많았었습니다. TL;DR

 

♻️ all images to webp · Issue #78 · kenu/okdevtv

https://gist.github.com/tabrindle/ed9f77b4e96f4c98b49b

github.com

 

🆗 오늘은 여기까지입니다. 제 유튜브 채널도 구독, 좋아요, 알람 부탁합니다.

생각보다 사람이 많지 않았습니다.10여명 정도가 참석한 세미나이니 집중도는 높았지만 더 많은 사람들이 참여해도 좋을텐데라는 생각도 듭니다.
자바 성능 향상은 그간 경험을 바탕으로 자바 성능에 관한 개론적인 세미나였습니다. 50분동안 세미나를 한다는 것이 쉬운 일이 아닙니다. 다행히 강사님의 열정으로 인해 15분 정도 더 진행하시더군요. 깔끔한 콘사이스 사전급 내용이라고 할까요. 쉽게 설명을 잘 해주셨습니다.

20:80의 법칙보다 더 현실적인 5:95의 법칙
5%의 애플리케이션이 95%의 사용량과 리소스를 점유한다는 현실계의 이야기

Profiling 과 APM의 차이점에 대한 깔끔한 비교

오늘 인상적인 두 가지였습니다.

이상민님의 책이 정말 잘 어울리겠구나 싶은 세미나이기도 했습니다.

3월세미나라 하는데, 3가지 주제는 다음과 같습니다.

3월 24일(화)     | 19:00 ~ 19:50   |    데이타  성능과 보호를 위한 RAID솔루션
3월 26일(목)     | 19:00 ~ 19:50   |    SW Testing 자격 취득
3월 31일(화)     | 19:00 ~ 19:50   |    웹 접근성 표준화 현황

저녁시간 삼성동에서 가까운 개발자들이 참석하기 딱 좋은 세미나입니다.
http://blog.sdnkorea.com/sls/117



이상민님의 멋진 강의 감사했습니다. 8시 메인 강의 이전에 TPTP로 간략하게 프로파일링하는 세션을 제가 진행했습니다. 그날 빌린 장소의 전기가 안 도와주는 바람에 15분 늦게 시작했지요. 죄송하게 생각합니다.

이상민 님의 강의는 아주 재밌었습니다. 실무에서의 경험담이 재밌었고, 특히나 뚱뚱한 PM과 날씬한 PM 앞에서 대화법은 아주 촌철살인이었습니다. 체격이 마른 PM 앞에서는 특히 말 조심해야한다는 지혜의 말씀이었죠.

사용자 삽입 이미지
사용자 삽입 이미지
사용자 삽입 이미지

뒷풀이에는 15분 정도가 참가했습니다. 때문에 금요일 오후 강남역 부근에 일찍 자리를 잡아놓지 않아서 또 많이 헤맸습니다. ^^; 그래서 들어간 곳이 조개구이집. 그 더운 날에 남아서 얘기 나누신 분들께 또 한 번 죄송했습니다. ㅡㅡ;
사용자 삽입 이미지
사용자 삽입 이미지


혼자서 30명이 넘는 세미나를 주최하는 무리수는 두지 말아야 할 것 같습니다.

이리도 빨리 30명의 신청이 빨리 끝날 줄은 몰랐습니다. ^^; 하루도 안 걸렸습니다. 이상민님을 모시고 2시간의 강의를 듣게 됩니다. 자바 성능과 튜닝에 대한 이야기죠.
금요일 저녁에 하는 세미나이기 때문에 워밍업타임을 위해서 저도 이클립스 TPTP에 대해서 간략하게 소개를 하게 됩니다.
메인 경기를 앞둔 오프닝 매치라고 할까요.

한빛미디어 출판사에서 몇 권의 책을 지원해주신다니 고마울 따름입니다.

7월에는 저자 세미나가 좀 있는 편 같네요. 저와 함께 "나는 프로그래머다"를 함께 쓰신 이춘식 님의 DB관련 세미나도 있고요, 친구인 옥상훈 차장플렉스 개정판 출간 기념 세미나도 flexcomponent 카페를 통해서 여니까 말이죠.

JUnit & Profiling 신촌 버전 장소도 신청해야겠습니다. ^^

http://www.eclipse.org/articles/Article-TPTP-Profiling-Tool/tptpProfilingArticle.html
문서에 있는 내용은 TPTP 초보자 가이드입니다. 프로파일링을 할 수 있도록 도와주는 것이죠. Test and Performance Tools Platform 이라는 말에서 알 수 있듯이 테스트와 성능진단을 위한 툴들의 플랫폼입니다. 기능이 무진장 많아서 어떻게 시작해야될지 막막한 느낌이 들기는 합니다.

설치를 간편히 하시려면 기존의 이클립스는 놔두시고, all-in-one버전을 받으시길 권장합니다.
ㅠㅠ; 맥용은 all-in-one버전이 없습니다. ^^;
http://www.eclipse.org/tptp/home/downloads/
사용자 삽입 이미지

문서에 있는 샘플을 실행해서 나온 리포트입니다.
사용자 삽입 이미지

몇 번 호출이 되었는지 CPU는 얼마나 사용되었는지, 호출 시간은 어떻게 되고 누적시간은 어떤지 보여줍니다.

공부할 게 또 생겼습니다. 그려~

related:
http://www.eclipse.org/tptp/home/documents/tutorials/profileOnServer/TPTP-WTP.html

+ Recent posts