본문 바로가기

분류 전체보기317

디자인 시스템 관련 링크 모음 1 https://design-tokens.github.io/community-group/ Design Tokens Technical Reports We'd also like to thank the following contributors: Abhishek Warokar, Ale Muñoz, Benjamin Kindle, Bjørn Madsen, Chase McCoy, Dale Sande, Dominique Hazael-Massieux, Evan Lovely, Fabian Friedl, Guilherme Nagüeva, Ivan Maksimovic, Jina Anne, Jon Levine, Ka design-tokens.github.io https://www.lightningdesignsystem.com/d.. 2022. 8. 9.
[오픈소스][React] react-custom-swipe 모바일 앱을 그대로 웹으로 옮기면서 좌우 스와이프를 통한 인피니티 스크롤을 구현해야했다. 관련해서 여러 제약 조건들을 충족 시켜주는 오픈소스 라이브러리를 찾을 수 없어서 스와이프 기능을 분석하고 하드코딩으로 개발을 하였는데 해당 기능에 흥미를 느껴서 오픈소스로 개발해서 정리를 해보고 싶은 생각으로 개발 해보았다. 개인적으로 찾아본 결과로는 기존 웹사이트나 관련 오픈소스의 경우 스와이프에서 레이지로딩이나 페이지네이션을 지원하는 케이스를 발견하지 못했다.(핀터레스트 등) 보통 스와이프 기능이라고 부르는 스와이프 모션과 플립 모션을 감지하여서 데스크탑과 모바일에서 스와이프 기능을 제공해준다. 또 내부 아이템들이 페이지네이션처럼 비동기적으로 추가되어도 index 쿼리스트링을 통해서 데이터(item)의 index.. 2022. 8. 3.
운동하면서 느낀점 요즘 MMA 도장에서 복싱을 배우면서 느낀 것들을 조금 정리 해본다. 특정 무술이나 운동은 각자 독자적인 환경에 맞춰서 목적을 수행하기 위해서 발전했다. 복싱의 경우 스텝이 낮으면서 가볍고 경쾌하다. 굳이 분류 짓자면 퀵스텝 류로 분류 할 수 있을거 같다. 장점은 단거리의 무게중심 전환이나 스탠스 전환이 용이하다는 점 단점은 체력소모가 상대적으로 심하고 바닥이 깔끔해야한다는 점 정도 있고 어느 무술이나 동일하지만 하체에 데미지가 쌓이면 스텝이 망가진다. 개인적으로 기존에는 삼재보(삼각형으로 좌우를 전환하는) 계통의 무술을 주로 수련해서 그런지 적응하는데 조금 힘들었는데 기존과 다르게 낮게뛰는거랑 무게 중심이 좌우로 이동하지 않고 좌우 스탠스를 계속 전환하면서 측면을 사용하지 않는게 많이 낯설었다. 이게 .. 2022. 7. 30.
[프론트엔드] 코드 스플릿에 대한 정리 벡엔드뿐 아니라 프론트엔드 개발에서 성능 최적화를 위해서 고려해야 할 요소는 상당히 많다. 디테일한 부분을 제외하고 큼직만 한 요소들을 축약해서 꼽자면 리소스 용량을 줄이는 것(압축 및 캐시와 분할), 렌더링 비용을 줄이는 것(DOM, CSSOM, VDOM), 네트워크 비용을 줄이는 것(커넥션 릴리즈) 정도로 분류할 수 있을 거 같다. 그중 리소스 용량 즉 js나 html, css, image등의 파일의 용량을 관리하는 방식으로 웹을 최적화할 수 있는데 단순히 압축(webp, gzip 등)을 통해서 해당 리소스들의 용량을 줄이는 방향과 cache를 통해서 중복 요청을 줄이는 방법 등이 존재한다. 그리고 단순히 용량을 줄인다는 측면이 아닌 꼭 필요한 부분만을 미리 가져다 쓴다는 측면의 분할을 적용하기도 하.. 2022. 7. 20.