Android向けHTML5ゲームの最適化

本日は、CANVAS要素と、HTML5でのゲーム自体の最適化について少しお話します。



HTMLパーツ



最近のブラウザでは、キャンバスでのレンダリングにビデオカードのパワーが使用されますが、デフォルトでは常にオンになっているわけではありません。 ブラウザの設定にアクセスして確認できます。 要素がこのような処理を引き起こすために、3D変換要素をHTMLのオブジェクトに追加できます。 缶を加速するための素晴らしい方法(実際ではない)は、canvasのそのような修正です:



canvas.style.WebkitTransform= 'translate3d(0,0,0)'; ...    canvas.style.transform= 'translate3d(0,0,0)';
      
      







何らかのフレームワークを使用した開発の観点からすべてを検討します。他の何かを操作できますが、これらの単純なパラメーターに注意してください、エンジンがそれらを指定しない場合は、CSSを介してキャンバス要素に割り当てることができますクラスとインラインメソッドの両方、まあ、またはJSを通じて。



JSコードを最適化します。 アプリケーションのDOMに頻繁にアクセスしないでください。 繰り返しになりますが、エンジンを使用すると、DOMへの呼び出しはまったくありません。



setInterval / setTimeout / while(1) {} 使用しないでください。



RequestAnimationFrameはHTML5のアニメーション用に導入されたもので、特にアニメーション用に導入されたため、このために最適化されています。 エンジンがフレーム更新を使用する方法、fpsを考慮するかどうか、およびdeltaTimeがそれを処理する方法に注意してください。



deltaTimeは、最後のフレームから経過した時間の変数である時間係数です。 繰り返しになりますが、Androidの標準WebViewは(ChromiumのWebView +とは異なり)速すぎないため、ゲームのFPSを1秒あたり25〜40フレームに制限することをお勧めします。 ゲームは安定して動作し、モバイルゲームの場合は非常に正常です。



Androidパーツ



また、以前の記事(広告、つまりテストアプリケーションへのリンクにより削除されました)では、Android Studioでゲームのラッパーを作成することに注意を払いました。このアプローチから逸脱することなく、このようなアプリケーションを作成するオプションを検討します。



ここでは、最適化のすべてが少し簡単になります。アルゴリズムに進む必要はありません。作業は、Androidアプリケーションにいくつかのパラメーターを追加するだけです。



次のフラグをゲームマニフェストに追加する必要があります。



 android:hardwareAccelerated="true"
      
      





これにより、ビデオカード(存在する場合)が接続され、画面で発生するすべての処理が行われますが、リリースに含める前に、最初に十分にテストしてください。一部のアプリケーションでは、ハードウェアが適切でない場合にのみ悪化します。



次にできることは、WebView要素自体の加速をオフにすることです。



 webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
      
      





正しく機能させるには、インポートのリストにビューを追加します。



このような単純な最適化ツールを掘り下げました。 今のところすべてです。



このアイデア全体についての著者の意見
一般に、Android向けHTML5はあらゆる意味で非常に粗雑であり、ブラウザーでの使用が正当化される場合、携帯電話ではそうではありません。 これを行うには、標準のAndroidツールを使用するのが最適です。 また、CANVAS、Bitmap、Paint、および描画のための一連のメソッドがあり、それらに基づいて単純なクラスを構築し、描画に使用することは非常に簡単で、(重要な)非常に生産的です。 さらに、WebViewを介してサウンドに問題があります。 彼女はそこにいないだけです。 つまり、たとえば、あるWebサイトのブラウザーで通常のページのようにゲームを開いても、WebViewを通じては存在しません。



AndroidでHTML5を使用するというテーマは、HTML / CSSと比較してAndroidの実装がそれほど簡単ではない美しいインターフェイスを備えたシンプルなアプリケーションにより関連していますが、ゲームに使用するには早すぎますが、非常に現実的です。



将来的には、この状況がWebViewの通常の操作に打ち勝つか、またはその代替手段を提供すると確信しています。



PS:誰かがそれらを必要とするならば、私はもう例へのリンクを与えません、PMに書いてください。 JSでエンジンを使用する例の大規模なデータベースもあります。



All Articles