협업툴 플로우
웹, 일렉트론, KTworks, 보라워크 신규 기능 및 유지보수 제품개선하고 있습니다.
퍼블리싱 및 UI 개발 업무, 프론트 유지보수
개선사항
- 이미지 Http 요청 횟수 줄이기(이미지스프라이트 기법 도입)
사용된 이미지가 많을 경우 웹 브라우저는 서버에 해당 이미지의 수만큼 요청해야만 하므로 웹 페이지의 로딩 시간이 오래 걸리게 됩니다.
서버로부터 Http요청 횟수를 줄여 줄이고 사이트 로딩 속도를 줄이고 내려받는 이미지의 크기까지 줄여줄 수있는 효과가 있습니다.
- 아이콘 폰트 제안하여 적극적으로 도입 → 깨지는 이슈가 더 이상 발생하지않음
DPI를 제공하는 기기들이 늘어나면서 이미지가 강제로 DPI에 맞게 늘어나 뿌옇게 보이거나 깨지는 현상이 발생이슈
- CSS `Flex Layout`을 적극적으로 도입, 반응형으로 구현
하위 브라우저 지원을 하지 않는다고 하여, 크기가 불명확하거나 동적으로 변할 때에도 효율적이고, 구현이 어려운 레이아웃을 간단하게 구현할 수 있습니다.
- Html / Css 코딩 컨벤션 작성
회사에 html/css 가이드가 없으며 id, class 네이밍이 사람마다 제 각각이었습니다. 이로 인하여, 가독성이 떨어져 마크업 구조를 파악하는데 불편함이 있었습니다. 또한 css가 inline-style로가 적용되어있어 css간 충돌이 발생하여(우선순위) 유지보수 측면에서 에로사항이 있었습니다.
가이드와 규칙을 정하면 에로사항 해결에 도움이 될거라고 생각하여 컨벤션을 적극적으로 제안하여 만들었습니다. 그 결과 여러명이 협업하는 과정에서 코드 스타일을 유지할 수 있으며, 가독성이 높아져 유지보수 하기 편해졌습니다.
더보기