2016-10-06 5 views
3

このAngular 2アプリは、Safari内で実行されているiPhoneのホーム画面に追加されたときに反応が遅くなります。iPhoneのホーム画面に追加したときにWebアプリケーションの応答が遅くなる

<meta name="apple-mobile-web-app-capable" content="yes"> 
<meta name="apple-mobile-web-app-title" content="Angular NavTabs"> 

あなたは数分のカップルを持っている場合は、check it out on Github Pages

私はindex.htmlにこれを追加することでできるウェブアプリ、それを作りました。

タブ間の切り替えは、Safariで実行すると非常に反応します。しかし、アプリがホームスクリーンから起動されると、遅れているように感じます。

この動作を修正するためにコードを変更したり追加したりできることはありますか?

注:アプリからアニメーションを削除すると同じことが起こります。

違いを見せるためにアニメーションGIFをいくつか記録しましたが、あなたが実際にアプリケーションとやりとりしていない限り、感謝するのは難しいです。

App running in Safari

App running from Home Screen

答えて

5

あなたのアプリがホーム画面に追加されると、ここではまだモバイル版Safariでかなりの時間のために固定されたが、悪名高い「300ms seconds delay」を、経験しています。

FastClickライブラリを使用すると問題が解決するはずです。で

import * as fastClick from 'fastclick'; 
fastClick.attach(document.body); 

編集:次に、あなたのmain.tsファイルに以下を追加

npm install --save fastclick

:NPMパッケージをインストールし、角度のアプリケーションでそれを使用するには

iOS 11、ホームスクリーンに追加されたweb-appsは、今度はWKWebViewでホストされます。 UIWebViewの代わりに、FastClickを廃止する予定です。https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Safari_11_0/Safari_11_0.html

希望します。

関連する問題