기획&구현6 [FE] 당근 플래너의 모바일/웹 페이지 성능 최적화 하기! 안녕하세요. 당근플래너 팀 프론트엔드를 맡은 강산입니다. 😊 당근 플래너는 좀 더 편한 유저 경험을 제공하기 위해 웹 페이지의 성능과 접근성을 최적화하였습니다! :) 저희는 ligth house라는 google chrome 툴을 사용하여 웹 페이지의 성능과 접근성의 점수를 측정하였습니다! 성능 개선 전 성능 개선 전에는 모바일에서 성능과 접근성이 너무 좋지 않았습니다. 😭 모바일 성능이 25라니 처참.. 성능 도메인 주소를 입력하여 사이트에 접속하고 웹페이지가 로딩되어 내용을 볼 수 있을 때까지 걸린 시간 사이트의 속도에 신경 써야 하는 이유 속도가 빠르면 방문자가 늘어나는 효과를 볼 수 있습니다. 구글 검색 로직에서 사이트 속도가 빠른 웹 페이지를 검색 우선순위에 올려주기 때문에 사이트 속도는 구글 검.. 2023. 2. 9. [BE] Bulk Update를 이용하여 대용량 데이터 한번에 update하기 안녕하세요. 당근플래너 팀 백엔드를 맡은 성원입니다.😊 당근플래너에서는 알림 버튼을 누르면 유저에게 온 모든 알림을 '읽음' 상태로 처리되도록 하는 API가 필요했습니다. 이때, 한 건씩 update를 하면 적은 용량의 데이터는 상관이 없지만 대용량을 한번에 처리할 때 성능상의 문제가 발생할 수 있는데요. 이 때문에 Bulk Update를 사용하여 한 번의 쿼리 만으로 다건의 데이터를 update를 하기로 했습니다. Bulk Update 우선 Bulk Operation(벌크 연산)이란 단건의 UPDATE, DELETE를 제외한 다건의 UPDATE, DELETE 연산을 하나의 쿼리로 처리하는 것을 의미합니다. 참고로 Hibernate는 INSERT 문도 지원합니다. 저희는 여기서 Bulk Update 쿼리.. 2023. 2. 8. [BE] 당근플래너 Redis 도입기 안녕하세요! 당근플래너 팀 백엔드를 맡은 진!입니다 😊 이번에는 저희 당근플래너 서비스에 Redis를 도입하게 된 이야기를 쓰려고 합니다. 🙄 갑자기 웬 Redis야? 레디스 도입을 이야기 하려면 먼저 리프레시토큰 이야기를 해야할 것 같아요. 이번 프로젝트를 진행하면서 난생 처음으로 Refresh Token을 구현해 보았는데요. 이 Refresh Token을 간단히 설명드릴게요. 저희가 어떤 서비스를 이용할 때 '로그인'이라는 과정을 통해 해당 서비스를 이용할 권한을 얻게 됩니다. 로그인 방식은 다양하지만 당근플래너는 'Access Token'을 유저에게 발급하는 방식으로 로그인을 진행하고 있어요. 유저는 이 Access Token만 있으면 당근플래너의 서비스를 이용할 수 있게 됩니다. 반대로 이 토큰이.. 2023. 2. 8. [FE] 당근플래너 유저 사용성 개선기 안녕하세요! 당근플래너 팀 프론트엔드를 맡은 다혜입니다 😊 당근플래너는, 유저의 입장에서 우리의 서비스를 어떻게 하면 편리하게 이용할 수 있을지 고민하고, 이것을 기술적으로 풀기 위해 노력하였는데요! 이번 프로젝트에서 저희의 유저 사용성을 향상시키기 위한 고민들과, 개선 방안들을 소개해 드리겠습니다! 1. 그룹원 초대를 더욱 더 간편하게 저희의 처음 '그룹원 초대' 기능의 기획은, 검색을 통해 닉네임을 찾고, 닉네임을 선택해 1명씩 초대를 하는 방식이었습니다. 하지만 저희가 기능을 사용해 보니, 여러명을 한번에 초대하거나, 선택한 사람을 취소하고 싶은 경우가 생기더라구요! 📌따라서 '초대 장바구니' 개념을 도입하기로 하였습니다. + 버튼을 누르면 ‘초대 장바구니’에 선택한 사람이 담기고, x 버튼을 누르.. 2023. 2. 6. 이전 1 2 다음
