JQM 양식, JQM 달력, 텍스트 필드, 단추 및 데이터베이스 등이 포함 된 일부보기로 리디렉션되는 단추 중 하나를 클릭하여 홈 페이지로 이동하는 여러 단추가 포함 된 하나의 응용 프로그램을 만들었습니다. ..Jquery Mobile Application Strange Behavior
내 질문에 내가 그 이미지를 사용하지 않았거나 더 많은 공간을 포함 할 수있는 데이터라도 그 시간에 응용 프로그램을 테스트하면 안드로이드 장치에서 약간 느리게 작동합니다. 그게 내 첫 번째 쿼리이고 두 번째는 그 시간에 안드로이드 타블렛에 내 애플리케이션을 테스트했을 때 양식 페이지가 잠시 동안 나타나고 갑자기 자동으로 홈 페이지로 리다이렉트되며 안드로이드 폰에서 잘 작동하는 동일한 기능입니다.
왜 이런 이상한 점이 있습니까?
중 하나가 내 즐거움
그것은 성능 저하 및 재 지정 문제에 관한 가정을 만들기 위해 어려운 것이라고 거기에 나를 인도 할 수 있습니다. 아래는 HTML5, CSS3, 자바 스크립트로 구성된 모바일 애플리케이션의 성능에 영향을 미치는 제 생각에는 분석, 디자인 및 개발 단계에서 고려해야 할 몇 가지 측면입니다. 크기에 따라
구현 방법은
작은 모바일 애플리케이션을 내부 AJAX 페이지의 링크를 사용하여 하나의 HTML 페이지의 사용을 개발하는 것이 좋습니다. 더 큰 모바일 애플리케이션의 경우, 내부 HTML 페이지와 내부 AJAX 링크를 사용하는 방법이 권장됩니다. 재사용 가능한 페이지 템플리트를 작성하십시오.
페이지 전환은 기본적으로 jQM 1.1.1 Docs에 명시된 바와 같이
, 페이드를 제외한 모든 전환은 3D 지원 변환이 필요합니다. 3D 지원이없는 장치는 지정된 전환에 관계없이 페이드 전환으로 되돌아갑니다. jQM은 Android 2.x와 같은 실적이 저조한 플랫폼을 고급 전환에서 능동적으로 제외하고 여전히 원활한 경험을 보장하기 위해이를 수행합니다. 3D 변환을 기술적으로 지원하는 Android 3.0과 같은 플랫폼이 있지만 여전히 애니메이션 성능이 떨어 지므로 모든 브라우저가 100 % 깜박임을 보장하지는 않습니다. 위의 사항을 고려한 후 사용할 전환 유형을 결정하십시오.
스크립트의 축소 JS 및 CSS 파일
각 페이지는 가능한 한 경량해야한다. 소형화의 목표는 전체 바이트 풋 프린트를 줄이면서 코드의 운영 품질을 유지하는 것입니다. 웹에는 YUI Compressor, Minify 등과 같이 많은 도구가 있습니다. 또한 JLint과 같은 도구가 있는데 JavaScript 소스 코드가 코딩 규칙을 준수하는지 확인하는 데 사용됩니다. JLint은 JavaScript 코드의 문제점을 검사하는 코드 품질 도구입니다. 보고 된 문제는 구문 오류 일 필요는 없지만 구조적 문제 일 수 있습니다. JLint는 코드가 정확한지 증명하지 않습니다. 도움 도구로 생각하십시오. 또한 CSS 최적화를 수행하는 도구가 있습니다. 최적화를 통해 CSS 파일 크기를 줄이고 코드를 작성할 수 있습니다. CleanCSS 및 CSSTidy과 같이 웹에서 사용할 수있는 많은 CSS 최적화 도구를 찾을 수 있습니다.
구성 요소는 HTML 페이지가 모바일 웹 브라우저의 대부분을위한 최적의 캐싱 우위를 확보하기 위해 25킬로바이트로 제한하는 것이 좋습니다
제한합니다. 캐싱 한도는 OS 버전에 따라 다릅니다. 예를 들어 Android 2.1의 캐시 제한은 약 2MB입니다.
HTML5 & CSS3
시도는, 읽기 쉽게 만들 수 확장 및 재사용 가능한 코드 수 있습니다. HTML5와 CSS3를 최대한 활용하는 것이 중요합니다. HTML5 DocType 선언 (<!DOCTYPE html>)은 html 태그보다 먼저 HTML5 문서의 첫 번째 항목이어야합니다. 이 페이지가 작성된 HTML의 버전에 대한 웹 브라우저에 대한 명령입니다.
W3C mobileOK Checker 웹의 이동 편의의 수준을 확인하는 데 도움이 W3C에 의해 무료 서비스 사용 문서, 특히 웹 문서가 mobileOK인지 여부를 명시합니다. 웹 페이지는 모든 테스트를 통과하면 mobileOK입니다. 테스트는 mobileOK Basic Tests 1.0 specification에 정의되어 있습니다. 모바일 친화성에 대한 웹 문서를 확인하는 것이 중요한 이유를 이해하려면 소위 모바일 분야에 대한 몇 가지 점을 강조하는 것이 좋습니다. 일반 데스크톱 컴퓨터와 비교할 때 휴대 기기는 화면 크기가 작고 처리 능력이 작으며 메모리가 적고 마우스가 없기 때문에 언뜻보기에는 제한적이라고 간주 될 수 있습니다. 고정 데이터 연결에 비해 모바일 네트워크는 느려지고 대기 시간이 더 길 수 있습니다. 컴퓨터 앞에 앉아있는 사용자와 비교할 때 이동중인 사용자는 제한된 시간을 가지며 쉽게 산만하게됩니다. 이러한 제약 조건 외에도 모바일 세상은 각기 다른 세분화 된 장치입니다. 각 장치는 고유 한 지원 기능 세트를 정의합니다.
다른 화면의 외관이
되는 화면 밀도와 다른 화면 크기를 대상으로 할 때 뷰포트의 크기와 웹 페이지의 규모가 고려되어야 크기를 고려하십시오. 뷰포트 메타 데이터를 사용하여 뷰포트 크기를 정의 할 수 있습니다. 여기서 뷰포트는 페이지가 그려지는 컨테이너 영역입니다. 뷰포트 눈금은 웹 페이지에 적용되는 줌 레벨을 정의합니다. target-densitydpi 뷰포트 속성과 CSS, JS 기법을 사용하여 웹 페이지의 대상 화면 밀도를 변경할 수 있습니다. 다양한 화면 크기의 모양과 관련하여 WEB에는 많은 기사가 있습니다.
는
PageSpeed Firefox/Chrome extension는 페이지가 빠르게 점검 할 수있는 잠재적 인 지연 플로우를 식별한다. Page Speed를 사용하여 웹 페이지를 프로파일하면 다양한 규칙에 대한 페이지의 적합성을 평가합니다. 이 규칙은 웹 개발의 모든 단계에서 적용 할 수있는 일반적인 프런트 엔드 모범 사례입니다. 이 확장은 규칙을 가장 잘 구현하고 개발 프로세스에 통합하는 방법에 대한 구체적인 팁과 제안을 제공합니다.
이 정보가 도움이되기를 바랍니다.
고마워요.이 답변은 정말 도움이됩니다. 크로스 플랫폼 애플리케이션을 개발할 때이 모든 것을 고려하는 것이 정말 좋습니다.나는 다른 phonegap 개발자에게도 이것을 권하고 싶다. 그래서 그들은 또한 그것으로부터 banipit을 얻을 수있다. 좋은 반응을 위해 다시 한 번. – Aamirkhan
나는 내가 도울 수있어서 기쁩니다 :) 위의 대답은 개인적인 견해이며 내 경험이 보여준 것과 같습니다. 어쩌면 다른 사람이 다른 성능 측면을 고려할 수도 있습니다. 감사합니다 –
hmmm하지만 대부분의 probebly ur 대답은 – Aamirkhan
jQuery Mobile의 어떤 버전입니까? PhoneGap의 버전은 무엇입니까? 수정을 시도하기 위해 지금까지 무엇을 했습니까? 몇 가지 코드를 보여줄 수 있습니까? 예를 들어, JS의 순서에는 무엇이 있습니까? – Jasper