Cordova-모범 사례

Cordova는 하이브리드 모바일 앱을 만드는 데 사용되므로 프로젝트에 선택하기 전에이 점을 고려해야합니다. 다음은 Cordova 앱 개발을위한 모범 사례입니다.

단일 페이지 앱

이것은 모든 Cordova 앱에 권장되는 디자인입니다. SPA는 단일 페이지 (일반적으로index.html). 라우팅은 AJAX를 통해 처리됩니다. 튜토리얼을 따라했다면 거의 모든 Cordova 플러그인이 장치가 준비 될 때까지 기다려야 사용할 수 있음을 알 수 있습니다. SPA 디자인은 로딩 속도와 전반적인 성능을 향상시킵니다.

터치 이벤트

Cordova는 모바일 세계에 사용되기 때문에 사용하는 것이 당연합니다. touchstart 과 touchend 대신 이벤트 click이벤트. 클릭 이벤트에는 300ms 지연이 있으므로 클릭이 기본적으로 느껴지지 않습니다. 반면 터치 이벤트는 모든 플랫폼에서 지원되지 않습니다. 무엇을 사용할지 결정하기 전에이 점을 고려해야합니다.

애니메이션

항상 하드웨어 가속을 사용해야합니다. CSS Transitions 자바 스크립트 애니메이션 대신 모바일 기기에서 더 잘 작동 할 것입니다.

저장

가능한 한 스토리지 캐싱을 사용하십시오. 모바일 네트워크 연결은 일반적으로 좋지 않으므로 앱 내부의 네트워크 호출을 최소화해야합니다. 사용자의 기기가 오프라인 일 때도 있으므로 앱의 오프라인 상태도 처리해야합니다.

스크롤

대부분의 경우 앱의 첫 번째 느린 부분은 스크롤링 목록입니다. 앱의 스크롤 성능을 향상시키는 몇 가지 방법이 있습니다. 기본 스크롤링을 사용하는 것이 좋습니다. 목록에 항목이 많으면 부분적으로로드해야합니다. 필요한 경우 로더를 사용하십시오.

이미지

이미지로 인해 모바일 앱이 느려질 수도 있습니다. 가능하면 CSS 이미지 스프라이트를 사용해야합니다. 크기를 조정하는 대신 이미지를 완벽하게 맞추십시오.

CSS 스타일

그림자와 그라디언트는 페이지의 렌더링 시간을 늦추므로 피해야합니다.

단순화

브라우저의 DOM은 느리므로 DOM 조작과 DOM 요소 수를 최소화해야합니다.

테스팅

가능한 한 많은 기기 및 운영 체제 버전에서 앱을 테스트해야합니다. 앱이 한 기기에서 완벽하게 작동한다고해서 다른 기기 나 플랫폼에서도 작동한다는 의미는 아닙니다.