.net Maui webViewの表示が遅くなる

Question

WindowsのVisualstudio2022で、.net Maui 製のAndroidアプリを作成しております。

1つの画面にwebViewを2つ配置しました。

すると片方のwebViewは即座に表示されるのですが、片方は数秒遅れることがありました。

また機種によっては、30秒ほど遅れることもありました。

これはテンプレート立ち上げ時のアプリ（ボタンを押すとカウントが増えるアプリ）を少し改修すれば再現できます。

これは何が原因でしょうか？また、解決策はありますか？

再現手順：

1. テンプレートプログラムを作成する
2. MainPage.xaml、MainPage.xaml.cs を編集する
3. Androidでデバッグを行うと、片方のwebViewの表示が遅い時がある。

再現環境：

　Android10（Galaxy A30）※表示遅い

　Android13（Galaxy A32 5G）※特に表示遅い

　Android14（Xperia SO-54C) ※1秒ほど遅延

ソースコード（プログラム名：Sample_Maui）

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="Sample_Maui.MainPage">
    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25">
            <WebView BackgroundColor="White" HeightRequest="190" Source="https://www.ntbssl.net/"/>
            <WebView BackgroundColor="White" HeightRequest="190" Source="https://www.ntbssl.net/"/>
        </VerticalStackLayout>
    </ScrollView>
</ContentPage>

using Sample_Maui.ViewModels.Logic.Api;
namespace Sample_Maui
{
    public partial class MainPage : ContentPage
    {
        int count = 0;
        public MainPage()
        {
            InitializeComponent();
        }
    }
}

Answer 1

「遅いときがある」なので常に遅いではなく、まれに遅くなるのですか？
MAUIが遅いのか、WebViewが遅いのか、そのURLのネットワークが遅いのかを切り分けないと何とも言えませんね。

# RAMを1GBにしてあるエミュレーターでためしてもWebViewを2個では全く遅くならず、もっとたくさんのWebViewで重いウェブページを読ませるとメモリ不足で遅くなりましたが…

MAUIをAndroidでデバッグ実行させるとVisualStudioの出力ウィンドウにログが出るので、まずはそれを確認することから。

それで遅い原因がわからなければ、ロードが遅いのかネットワークが遅いのかを以下のようにイベントを監視すればよいでしょう。

<WebView AutomationId="wv1" BackgroundColor="White" HeightRequest="100" Source="https://www.microsoft.com/" 
            Loaded="wv_Loaded"  Navigating="wv_Navigating" Navigated="wv_Navigated"/>
<WebView AutomationId="wv2" BackgroundColor="White" HeightRequest="100" Source="https://www.bing.com/"
            Loaded="wv_Loaded"  Navigating="wv_Navigating" Navigated="wv_Navigated"/>
<WebView AutomationId="wv3" BackgroundColor="White" HeightRequest="100" Source="https://copilot.microsoft.com/"
            Loaded="wv_Loaded" Navigating="wv_Navigating" Navigated="wv_Navigated"/>
<!--  他にも沢山 -->

private void wv_Loaded(object sender, EventArgs e) => DebugWriteLineName(sender);
private void wv_Navigating(object sender, WebNavigatingEventArgs e) => DebugWriteLineName(sender);
private void wv_Navigated(object sender, WebNavigatedEventArgs e) => DebugWriteLineName(sender);

private void DebugWriteLineName(object sender, [System.Runtime.CompilerServices.CallerMemberName] string evname = "")
{
    if (sender == null) return;
    var membytes = GC.GetTotalMemory(false);
    var name = ((Element)sender).AutomationId;
    System.Diagnostics.Debug.WriteLine($"{DateTime.Now:HH:mm:ss.fff} {evname} {name} Mem={membytes}");
}

あとは、Androidの開発者向けオプションを有効にして、システムトレースのWebViewなどを調べないとわからないでしょう。