Terokai masalah besar dan penyelesaian uniapp

Dengan populariti Internet mudah alih, pembangunan aplikasi menjadi semakin penting. Atas dasar pembangunan asli mengikut sistem pengendalian dan peranti yang berbeza, pembangunan hibrid juga telah menjadi pilihan popular. Sebagai rangka kerja pembangunan merentas platform, uniapp boleh membantu pembangun membina aplikasi berbilang terminal dengan cepat. Walau bagaimanapun, sesetengah pembangun mengalami sakit kepala apabila membangunkan dengan uniapp: saiz aplikasi terlalu besar dan tidak boleh dipratonton atau diterbitkan. Jadi, bagaimana kita harus menyelesaikan masalah ini? Artikel ini akan meneroka masalah ini dan memberikan penyelesaian.

1. Asal-usul masalah

Masalah saiz uniapp yang berlebihan datang daripada ciri rangka kerja itu sendiri. Untuk memastikan keupayaan merentas platform uniapp, pegawai itu menyediakan perpustakaan komponen UI dan penyelesaian penyesuaian untuk berbilang platform. Walaupun perpustakaan komponen dan penyelesaian penyesuaian ini memastikan keserasian uniapp pada platform yang berbeza, ia juga menjadikan saiz aplikasi lebih besar. Pustaka komponen dan penyelesaian penyesuaian untuk platform berbeza mungkin mengandungi sejumlah besar imej, fon, kod JavaScript dan sumber lain, yang akan meningkatkan saiz aplikasi.

2. Penyelesaian rasmi

Mengenai masalah saiz uniapp yang berlebihan, pegawai itu juga menyediakan beberapa penyelesaian. Berikut ialah beberapa penyelesaian yang berkesan:

1 Pemuatan subpakej

Pemuatan subpakej ialah sejenis sumber yang memisahkan aplikasi, meletakkan beberapa sumber ke dalam pakej berasingan dan memuatkannya mengikut permintaan. . , dengan itu mengurangkan saiz aplikasi. Dalam uniapp, memperkenalkan subpackaging perlu ditetapkan dalam fail manifest.json. Tetapan khusus adalah seperti berikut:

{
  "subPackages": [
    {
      "root": "pages/book/",
      "name": "book",
      "pages": ["index", "details"]
    }
  ]
}

Kod di atas mentakrifkan subpakej bernama "buku", yang mengandungi dua halaman: halaman/buku/indeks dan halaman/buku/detail. Apabila merujuk halaman ini dalam aplikasi, anda boleh menggunakan fungsi lompat seperti uni.navigateTo() untuk memuatkannya.

2. Sumber termampat

Aplikasi kebanyakannya mengandungi gambar, fon, JavaScript dan sumber lain. Dengan memampatkan sumber ini, anda boleh mengurangkan saiz aplikasi anda. Dalam uniapp, anda boleh menggunakan alat pemampatan pihak ketiga seperti TinyPNG, Webpack, dll. untuk memampatkan sumber.

3. Gunakan Webpack untuk membongkar kod

Webpack ialah alat binaan bahagian hadapan yang popular yang boleh membungkus kod. Dalam uniapp, anda boleh menggunakan Webpack untuk membongkar kod aplikasi dan membungkus sebahagian kod JavaScript ke dalam fail berasingan. Berbeza dengan sub-pembungkusan, menggunakan Webpack untuk membongkar kod boleh meletakkan kod teras aplikasi ke dalam pakej utama, menjadikan aplikasi bermula lebih cepat.

3. Penyelesaian lain

Selain daripada penyelesaian rasmi, terdapat beberapa penyelesaian lain yang patut diterokai:

1. Gunakan ikon fon untuk menggantikan gambar

Dalam uniapp, ikon fon boleh digunakan dan bukannya sumber imej. Kelebihan ikon fon ialah saiz failnya lebih kecil dan ia boleh dimanipulasi dan diedit terus melalui CSS. Penggunaan khusus adalah seperti berikut:

<template>
  <view>
    <text class="iconfont">&#xe600;</text>
  </view>
</template>

<style>
  .iconfont {
    font-family: "iconfont"; /*引入字体*/
    font-size: 32px; /*设置字体大小*/
    color: red; /*设置字体颜色*/
  }
</style>

Kod di atas memperkenalkan fon bernama "iconfont" dan menggunakan CSS untuk menggayakannya. Dalam penggunaan sebenar, ikon berbeza boleh ditetapkan melalui teks.

2. Gunakan imej svg dan bukannya bitmap

Dalam uniapp, anda boleh menggunakan imej vektor svg untuk menggantikan bitmap Kelebihan imej svg ialah saiz fail lebih kecil dan tidak melibatkan piksel . Zum masuk dan keluar tanpa had tanpa kehilangan kejelasan. Tetapi apa yang perlu diperhatikan ialah jika imej svg mengandungi sejumlah besar laluan vektor dan sejumlah besar laluan Klip. Ia juga akan menyebabkan saiz svg menjadi agak besar.

4. Ringkasan

Saiz yang berlebihan ialah masalah utama uniapp, tetapi ini tidak bermakna tiada penyelesaian. Melalui penyelesaian seperti pembungkusan kecil, memampatkan sumber, menggunakan Webpack untuk memisahkan kod, dan menggunakan ikon fon dan imej SVG dan bukannya peta bit, saiz aplikasi boleh dikurangkan dengan berkesan. Dalam pembangunan sebenar, kita boleh memilih penyelesaian yang berbeza berdasarkan ciri-ciri aplikasi untuk mencapai hasil yang optimum.

Atas ialah kandungan terperinci Terokai masalah besar dan penyelesaian uniapp. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!