Buat aplikasi kanvas yang besar dan kompleks

Artikel
08/05/2024

Sebagian besar artikel di bagian dokumentasi ini mencakup performa runtime aplikasi seperti yang dialami oleh orang-orang yang menggunakannya. Artikel ini membahas performa aplikasi seperti yang dialami oleh orang-orang yang membuatnya.

Karena aplikasi menjadi lebih besar dan lebih kompleks, perlu Power Apps Studio memuat dan mengelola lebih banyak kontrol, rumus, dan sumber data, semuanya dengan saling ketergantungan yang tumbuh secara eksponensial. Power Apps Studio dapat memakan waktu lebih lama untuk dimuat, dan fitur seperti IntelliSense dan pengkodean warna dapat tertinggal. Gunakan rekomendasi berikut untuk bekerja dengan lebih baik dengan aplikasi besar dan kompleks di Power Apps Studio. Mereka juga dapat membantu meningkatkan performa runtime aplikasi Anda.

Contoh dalam artikel ini menggunakan solusi sampel Respons Darurat Rumah Sakit.

Menggunakan App.Formulas alih-alih App.OnStart

Tip

Anda dapat menggunakan Fungsi With dan properti output kustom komponen kanvas sebagai alternatif untuk rumus bernama.

Cara terbaik untuk mengurangi waktu pemuatan untuk keduanya Power Apps Studio dan aplikasi Anda adalah dengan mengganti inisialisasi variabel dan koleksi di App.OnStart dengan rumus bernama di App.Formulas.

Mari kita lihat contoh berikut, yang menggunakan App.OnStart.

// Get the color of text on a dark background.
Set(varColorOnDark,RGBA(0, 0, 0, 1));

// Get the color of the menu icons.
Set(varColorMenuIcon,"#0070a9");

// Get the styles for a form.
Set(varFormStyle,
    {
        DataCard: { Height: 50 },
        Title: { Height: 50, Size: 21, Color: varColorOnDark },
        Control: { Height: 50, Size: 18 },
        Label: { Size: 18, Color: varColorOnDark }
    }
);

ClearCollect(
    FacilitiesList,
    ForAll(
        Facilities,
        { Name: 'Facility Name', Id: Facility }
    )
);
If(
    Not IsBlank(Param("FacilityID")),
    Set(ParamFacility,
        LookUp(
            FacilitiesList,
            Id = GUID(Param("FacilityID"))
        ).Name
    );
);

Karena merupakan urutan pernyataan, aplikasi Anda harus mengevaluasi panggilan Set dan Collect ini secara berurutan sebelum dapat menampilkan layar pertama, yang membuat aplikasi dimuat lebih lambat. Dan karena seluruh App.OnStart harus dipertimbangkan secara keseluruhan, urutan dipertahankan, dan kesalahan digabungkan sebelum mengembalikan hasil akhir, rumusnya rumit untuk Power Apps Studio dianalisis.

Ada cara yang lebih baik. Gunakan App.Formulas sebagai gantinya dan tentukan variabel dan koleksi ini sebagai rumus bernama, seperti dalam contoh berikut.

// Get the color of text on a dark background.
varColorOnDark = RGBA(0, 0, 0, 1);

// Get the color of the menu icons.
varColorMenuIcon = "#0070a9";

// Get the styles for a form.
varFormStyle = 
    {
        DataCard: { Height: 50 },
        Title: { Height: 50, Size: 21, Color: varColorOnDark },
        Control: { Height: 50, Size: 18 },
        Label: { Size: 18, Color: varColorOnDark }
    };

FacilitiesList =
    ForAll(
        Facilities,
        { Name: 'Facility Name', Id: Facility }
    );

ParamFacility = 
    If( Not IsBlank(Param("FacilityID")),
        LookUp(
            FacilitiesList,
            Id = GUID(Param("FacilityID"))
        ).Name,
        Blank()
    );

Perubahan ini mungkin tampak kecil, tetapi dapat berdampak besar. Karena setiap rumus bernama independen dari yang lain, Power Apps Studio dapat menganalisisnya secara independen, secara efektif membagi App.OnStart yang besar menjadi potongan-potongan yang lebih kecil. Kami telah melihat Power Apps Studio waktu muat turun sebanyak 80% dengan perubahan ini saja.

Aplikasi Anda juga dimuat lebih cepat karena tidak perlu mengevaluasi rumus ini hingga membutuhkan hasilnya. Layar pertama aplikasi segera ditampilkan.

Rumus bernama tidak dapat digunakan dalam semua situasi karena Anda tidak dapat memodifikasinya atau menggunakannya dengan Set. Beberapa situasi memerlukan penggunaan variabel status yang dapat dimodifikasi. Set sangat cocok untuk situasi ini dan Anda harus terus menggunakannya. Namun, lebih sering daripada tidak, Anda menggunakan variabel global di OnStart untuk menyiapkan nilai statis yang tidak berubah. Dalam kasus tersebut, rumus bernama adalah pilihan yang lebih baik.

Karena rumus bernama tidak dapat diubah, awalan var (kependekan dari "variabel") sebagai konvensi penamaan tidak lagi sesuai. Kami tidak mengubah nama dalam contoh ini karena akan memerlukan perubahan pada aplikasi lainnya agar cocok.

Sangat menggoda untuk menempatkan rumus bernama di App.OnStart, tetapi jangan. Mereka tidak termasuk di sana. Sebagai properti On behavior, App.OnStart mengevaluasi setiap pernyataannya secara berurutan, membuat variabel global, dan berbicara dengan database hanya sekali, saat aplikasi dimuat. Rumus bernama adalah rumus yang menentukan cara menghitung sesuatu kapan pun dibutuhkan dan selalu benar. Sifat rumus inilah yang memungkinkan mereka untuk mandiri dan memungkinkan aplikasi menyelesaikan pemuatan sebelum dievaluasi.

Pisahkan rumus panjang

App.OnStart adalah salah satu pelanggar terburuk untuk rumus panjang dan pasti di mana Anda harus memulai, tetapi itu bukan satu-satunya kasus.

Studi kami telah menunjukkan bahwa hampir semua aplikasi dengan waktu muat Power Apps Studio yang lama memiliki setidaknya satu rumus lebih dari 256.000 karakter. Beberapa aplikasi dengan waktu muat terlama memiliki rumus lebih dari 1 juta karakter. Formula yang telah lama memberikan tekanan Power Apps Studio yang signifikan.

Lebih buruk lagi, menyalin dan menempelkan kontrol dengan rumus panjang menduplikasi rumus dalam properti kontrol tanpa disadari. Power Apps dimodelkan setelah Excel, di mana beberapa salinan rumus adalah umum. Namun, dalam Excel rumus dibatasi pada satu ekspresi dan dibatasi pada 8.000 karakter. Power Apps Rumus dapat tumbuh lebih lama dengan diperkenalkannya logika imperatif dan operator rantai (; atau ;;, tergantung pada lokal).

Solusi umumnya adalah membagi rumus panjang menjadi bagian-bagian yang lebih kecil dan menggunakan kembali bagian-bagiannya, seperti yang kita lakukan di bagian sebelumnya ketika kita mengubah pernyataan Set/Collect di App.OnStart ke rumus bernama di App.Formulas. Dalam bahasa pemrograman lain, bagian yang dapat digunakan kembali sering disebut sebagai subrutin atau fungsi yang ditentukan pengguna. Anda dapat menganggap rumus bernama sebagai bentuk sederhana dari fungsi yang ditentukan pengguna tanpa parameter atau efek samping.

Menggunakan rumus bernama di mana saja

Dalam contoh sebelumnya, kami menggunakan rumus bernama sebagai pengganti App.OnStart ·. Namun, Anda dapat menggunakannya untuk mengganti perhitungan di mana saja di aplikasi.

Misalnya, salah satu layar dalam solusi sampel Respons Darurat Rumah Sakit menyertakan logika ini di Screen.OnVisible:

ClearCollect(
    MySplashSelectionsCollection,
    {
        MySystemCol: First(
            Filter(
                Regions,
                Region = MyParamRegion
            )
        ).System.'System Name',
        MyRegionCol: First(
            Filter(
                Regions,
                Region = MyParamRegion
            )
        ).'Region Name',
        MyFacilityCol: ParamFacility,
          MyFacilityColID:  LookUp(
            FacilitiesList,
            Id = GUID(Param("FacilityID"))
        ).Id
    }
);

Rumus ini dapat dibagi menjadi sekumpulan rumus bernama. Itu juga membuat rumus lebih mudah dibaca.

MyRegion = LookUp(
                    Regions,
                    Region = MyParamRegion
           );

MyFacility = LookUp(
                    FacilitiesList,
                    Id = GUID(Param("FacilityID")
            );

MySplashSelectionsCollection = 
    {
        MySystemCol: MyRegion.System.'System Name',
        MyRegionCol: MyRegion.'Region Name',
        MyFacilityCol: ParamFacility,
        MyFacilityColID:  MyFacility.Id
    };

Kami mengekstrak ParamFacility sebagai rumus bernama sebelumnya ketika kami memindahkan sebagian besar panggilan Set dari App.OnStart ke rumus bernama di App.Formulas.

Rumus bernama dievaluasi hanya jika nilainya diperlukan. Jika maksud awal menggunakan Screen.OnVisible adalah untuk menunda pekerjaan hingga layar ditampilkan, maka pekerjaan masih ditangguhkan sebagai rumus bernama global di App.Formulas.

Gunakan fungsi With

Anda juga dapat menggunakan fungsi With dalam rumus untuk membagi logika. Buat rekaman di parameter pertama dengan nilai yang ingin Anda gunakan sebagai bidang, lalu gunakan bidang tersebut di parameter kedua untuk menghitung nilai yang dikembalikan dari With. Misalnya, contoh sebelumnya dapat ditulis hanya sebagai satu rumus bernama:

MySplashSelectionsCollection = 
    With( { MyRegion: LookUp(
                            Regions,
                            Region = MyParamRegion
                      ),
            MyFacility: LookUp(
                            FacilitiesList,
                            Id = GUID(Param("FacilityID")
                      ) 
           },
           {
                MySystemCol: MyRegion.System.'System Name',
                MyRegionCol: MyRegion.'Region Name',
                MyFacilityCol: ParamFacility,
                MyFacilityColID:  MyFacility.Id
           }
    )

Salah satu kelemahan menggunakan With dengan cara ini adalah tidak dapat digunakan MyFacility karena mereka didefinisikan dalam fungsi With MyRegion yang sama , masalah yang tidak ada dengan rumus bernama . Salah satu solusinya adalah dengan menumpuk fungsi With dan menggunakan kata kunci As untuk memberi nama rekaman untuk masing-masing untuk memberikan akses mudah ke semua variabel With .

Menggunakan komponen kanvas

Komponen kanvas paling sering digunakan untuk membuat kontrol UI yang dapat ditempatkan di kanvas seperti kontrol. Anda juga dapat menggunakannya tanpa menempatkannya di UI untuk melakukan perhitungan dengan properti output kustom sebagai alternatif rumus bernama. Komponen kanvas mudah dibagikan di seluruh aplikasi dengan pustaka komponen dan, tidak seperti rumus bernama, didukung sepenuhnya. Namun, mereka lebih sulit untuk dikonfigurasi dan digunakan daripada rumus bernama.

Untuk memisahkan logika:

Dalam Power Apps Studio, beralih ke tab Komponen di tampilan Pohon.
Membuat komponen baru.
Di panel Properti, aktifkan Cakupan aplikasi Access.
Tambahkan properti kustom.
Atur Jenis properti ke Output dan Jenis data yang sesuai.
Pilih Buat.
Di pemilih properti di samping bilah rumus di bagian atas layar, pilih properti baru.
Tulis rumus untuk logika untuk dipisahkan dan digunakan kembali.

Untuk menggunakan logika:

Beralih ke tab Layar di tampilan hierarkis.
Di panel Sisipkan, perluas Kustom dan sisipkan komponen Anda.
Untuk menghitung nilai dengan properti, gunakan ComponentName.PropertyName.

Gunakan Pilih dengan kontrol tersembunyi untuk logika imperatif

Logika imperatif digunakan untuk mengubah status dengan Set and Collect, memberi tahu pengguna dengan Notify , menavigasi ke layar atau aplikasi lain dengan Navigate and Launch, dan menulis nilai ke database dengan Patch , SubmitForm , atau RemoveIf . ·

Rumus bernama dan properti output kustom komponen kanvas tidak mendukung logika imperatif. Cara umum untuk memisahkan logika imperatif adalah dengan menggunakan properti OnSelect dari kontrol tersembunyi.

Tambahkan kontrol Tombol ke layar.
Atur properti OnSelect ke logika imperatif yang ingin Anda jalankan.
Tetapkan properti Visible ke false, karena pengguna tidak perlu melihat atau berinteraksi dengannya.
Panggil Select( Button ) saat Anda ingin menjalankan logika imperatif.

Misalnya, salah satu layar dalam sampel kami memiliki properti OnSelect berikut pada kontrol Button . (Contoh sederhana ini hanya untuk tujuan ilustrasi. Biasanya, Anda hanya akan menggunakan teknik ini untuk rumus yang lebih panjang.)

btnAction_17.OnSelect = 
    Trace("Feedback Screen: Submit Button",TraceSeverity.Information);
    If(
        // Proceed if all forms are validated.
        And(
            FormFeedback.Valid
        ),
    
        // Set the updates to static variables.
        Set(updatesFeedback,Patch(Defaults('App Feedbacks'), FormFeedback.Updates));
        // Submit the first form. Subsequent actions can be found in the OnSuccess.
        SubmitForm(FormFeedback);
        ,
    
        Notify("Please complete all fields before proceeding",
               NotificationType.Warning,2000)
    );

Untuk membagi logika ini menjadi beberapa bagian, kita dapat menempatkan bagian-bagian ke kontrol Button terpisah dan Pilihlah dari aslinya:

btnTrace.OnSelect = 
    Trace("Feedback Screen: Submit Button",TraceSeverity.Information);

btnSubmit.OnSelect = 
    If(
        // Proceed if all forms are validated.
        And(
            FormFeedback.Valid
        ),
    
        // Set the updates to static variables.
        Set(updatesFeedback,Patch(Defaults('App Feedbacks'), FormFeedback.Updates));
        // Submit the first form. Subsequent actions can be found in OnSuccess.
        SubmitForm(FormFeedback);
        ,
    
        Notify("Please complete all fields before proceeding",
               NotificationType.Warning,2000)
    );

btnAction_17.OnSelect = 
    Select( btnTrace );
    Select( btnSubmit );

Teknik ini hanya berfungsi pada layar yang sama. Teknik lain yang sedikit lebih rumit bekerja di seluruh layar, seperti menggunakan kontrol Toggle, mengatur OnCheck ke logika yang ingin Anda jalankan, dan mengatur Default ke variabel global, lalu mengalihkan variabel global dengan Set( global, true ); Set( global, false ) pada titik yang ingin Anda jalankan logika.

Dalam contoh ini, beberapa pemisahan logika telah dilakukan. Komentar tersebut menyebutkan bahwa "Tindakan selanjutnya dapat ditemukan di OnSuccess." Peristiwa ini menjalankan logika imperatif setelah rekaman berhasil dikirimkan, solusi khusus untuk fungsi SubmitForm .

Mempartisi aplikasi

Beberapa aplikasi tumbuh menjadi ribuan kontrol dan ratusan sumber data, yang melambat Power Apps Studio. Seperti rumus panjang, aplikasi besar dapat dibagi menjadi beberapa bagian yang lebih kecil yang bekerja sama untuk menciptakan satu pengalaman pengguna.

Aplikasi kanvas terpisah

Salah satu pendekatannya adalah mengimplementasikan bagian di aplikasi kanvas terpisah dan menggunakan fungsi Launch untuk menavigasi di antara aplikasi terpisah dan meneruskan konteks yang diperlukan.

Pendekatan ini digunakan dalam solusi sampel Respons Darurat Rumah Sakit. Aplikasi terpisah mengelola setiap area utama dari keseluruhan aplikasi. Aplikasi berbagi komponen switchboard umum melalui pustaka komponen yang ditampilkan setiap aplikasi di layar startup-nya:

Screenshot aplikasi kanvas solusi Contoh Respons Darurat Rumah Sakit yang berjalan di ponsel, yang menunjukkan komponen kanvas switchboard.

Saat pengguna memilih area, komponen menggunakan metadata tentang aplikasi yang tersedia dan aplikasi mana yang menghosting komponen. Jika layar yang diinginkan ada di aplikasi ini (yaitu, ThisItem.Screen tidak kosong), maka panggilan Navigate dibuat. Tetapi jika layar yang diinginkan berada di aplikasi yang berbeda (yaitu, ThisItem.PowerAppID tidak kosong), maka fungsi Peluncuran digunakan dengan ID Aplikasi target dan konteks FacilityID:

If(
    IsBlank(ThisItem.Screen),
    If(IsBlank(ThisItem.PowerAppID), 
        Launch(ThisItem.URL),           
        Launch("/providers/Microsoft.PowerApps/apps/" & ThisItem.PowerAppID, 
               "FacilityID", Home_Facility_DD.Selected.Id)
    ),
    Navigate(
        ThisItem.Screen,
        Fade
    )
);

Status di aplikasi asli hilang saat aplikasi lain diluncurkan. Pastikan untuk menyimpan status apa pun sebelum Anda memanggil fungsi Launch. Tulis ke database, panggil SaveData, atau teruskan status ke aplikasi target dengan parameter yang dibaca dengan fungsi Param .

Aplikasi berdasarkan model dengan halaman kustom

Bagian juga dapat diimplementasikan sebagai halaman khusus. Halaman kustom bertindak sebagai aplikasi kanvas mini dengan kontainer aplikasi berdasarkan model untuk navigasi.

Catatan

Apa bahasa dokumentasi yang Anda inginkan? Lakukan survei singkat. (perlu diketahui bahwa survei ini dalam bahasa Inggris)

Survei akan berlangsung kurang lebih selama tujuh menit. Tidak ada data pribadi yang dikumpulkan (pernyataan privasi).

Bagikan melalui