PricingLoginStart free
Itsenäinen mobiilisovelluskehitys · Oppitunti

Suorituskyvyn ja koetun nopeuden suunnittelu

Tehkää sovelluksestanne nopean ja responsiivisen tuntuinen hallitsemalla koetun suorituskyvyn tekniikoita, lataustiloja, skeleton-näkymiä ja sujuvaa renderöintiä, jonka käyttäjät todella huomaavat.

Oppitunti 4/413 vaihetta

Suorituskyvyn ja koetun nopeuden suunnittelu on ilmainen Itsenäinen mobiilisovelluskehitys-oppitunti CoddyKitissä. Tämä on oppitunti 4/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu Itsenäinen mobiilisovelluskehitys-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Itsenäinen mobiilisovelluskehitys-kurssilla on yhteensä 4 oppituntia.

Nopeus on ominaisuus

Käyttäjät hylkäävät hitaat sovellukset nopeammin kuin antavat anteeksi virheitä. Raaka nopeus on kuitenkin vain puolet kokonaisuudesta — yhtä tärkeää on se, kuinka nopealta sovellus tuntuu.

Tässä oppitunnissa käsitellään sekä todellista että koettua suorituskykyä.

Koettu ja todellinen suorituskyky

Todellista suorituskykyä mitataan millisekunteina. Koettu suorituskyky kertoo, kuinka hitaalta sovellus tuntuu käyttäjästä.

Älykäs palaute voi saada kahden sekunnin latauksen tuntumaan välittömältä, kun taas tyhjä näyttö saa 500 millisekunnin viiveen tuntumaan rikkoutumiselta.

Luurankonäytöt

Ilmaisimen sijaan näyttäkää luuranko: tulevan sisällön muotoiset harmaat paikanvaraajat. Käyttäjät havaitsevat edistymisen, eikä asettelu hypi, kun tiedot saapuvat.

Lataustilat oikein toteutettuina

Jokainen asynkroninen näyttö tarvitsee neljä tilaa:

  • Ladataan
  • Onnistui
  • Tyhjä
  • Virhe

Kaikkien neljän tilan suunnittelu estää hämmentävät tyhjät näytöt.

Kalliin työn viivyttäminen

Nopeat tapahtumat, kuten kirjoittaminen, voivat käynnistää kalliita kutsuja. Debouncing odottaa toiminnan loppumista ennen suorittamista.

function debounce(fn, ms) {
  let timer;
  return (...args) => {
    clearTimeout(timer);
    timer = setTimeout(() => fn(...args), ms);
  };
}
const search = debounce(() => console.log('searching'), 300);
search();

Laiska lataus

Älkää ladatko kaikkea kerralla. Ladatkaa kuvat ja näytöt tarvittaessa ja jakakaa pitkät luettelot sivuihin.

Näin ensimmäinen lataus nopeutuu ja muistin käyttö vähenee.

Välimuisti nopeaa paluuta varten

Tallentakaa haetut tiedot välimuistiin, jotta näytölle palaaminen näyttää sisällön heti samalla, kun tuoreet tiedot latautuvat taustalla.

const cache = new Map();
function getCached(key, loader) {
  if (cache.has(key)) return cache.get(key);
  const value = loader();
  cache.set(key, value);
  return value;
}
console.log(getCached('user', () => 'Alice'));

Sujuva piirtäminen

Ny­kivä vieritys tuhoaa laadukkuuden vaikutelman. Pitäkää ruutujen käsittelyaika alle 16 millisekunnissa välttämällä raskasta työtä pääsäikeessä ja käyttämällä luettelon rivejä uudelleen niiden rakentamisen sijaan.

Optimistisen käyttöliittymän kertaus

Reagoikaa käyttäjän toimintaan heti sen sijaan, että odottaisitte palvelinta. Tykkäyksen napauttamisen pitäisi täyttää sydän välittömästi ja synkronoida sitten.

Tämä yksittäinen tekniikka muuttaa ratkaisevasti sovelluksen koettua responsiivisuutta.

Tärkeiden asioiden mittaaminen

Ette voi parantaa sitä, mitä ette mittaa. Seuratkaa seuraavia asioita:

  • Aika ensimmäiseen merkitykselliseen sisältöön
  • Vierityksen aikana pudonneet ruudut
  • Kylmäkäynnistyksen kesto

Profiloikaa oikeilla edullisilla laitteilla, älkää vain nopealla puhelimellanne.

Nopeuden tarkistuslista

Ennen julkaisua:

  • Luurakenteet ilmaisimien sijaan
  • Kaikki neljä lataustilaa suunniteltuina
  • Viivyttäkää ja ladatkaa tarvittaessa raskaat toiminnot
  • Käyttäkää välimuistia nopeaa paluuta varten
  • Käyttöliittymän optimistinen päivitys toimintoja varten

Nopea ja nopealta tuntuva sovellus voittaa käyttäjät puolelleen.

Pikatesti

Testatkaa suorituskykyyn liittyvät käyttökokemusta koskevat tietonne.

Vastaa interaktiivisessa oppitunnissa

Kertaus

Opitte suunnittelemaan nopeutta varten:

  • Koettu nopeus on yhtä tärkeää kuin todellinen nopeus
  • Käyttäkää luurankoja ja suunnitelkaa kaikki neljä lataustilaa
  • Viivyttäkää, ladatkaa tarvittaessa ja tallentakaa raskaat toiminnot välimuistiin
  • Käyttäkää optimistista käyttöliittymää välitöntä palautetta varten
  • Mit­takaa oikeilla edullisilla laitteilla

Nopealta tuntuva sovellus saa käyttäjät palaamaan.

Aloita maksutta

Opi Itsenäinen mobiilisovelluskehitys tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit
12
Oppitunnit
48
Aloita opiskelu maksuttaNäytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”Suorituskyvyn ja koetun nopeuden suunnittelu” ilmainen?

Kyllä – oppitunnin ”Suorituskyvyn ja koetun nopeuden suunnittelu” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko Itsenäinen mobiilisovelluskehitys-kurssin, päivitä CoddyKit PROhon. Itsenäinen mobiilisovelluskehitys-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Suorituskyvyn ja koetun nopeuden suunnittelu”?

Tehkää sovelluksestanne nopean ja responsiivisen tuntuinen hallitsemalla koetun suorituskyvyn tekniikoita, lataustiloja, skeleton-näkymiä ja sujuvaa renderöintiä, jonka käyttäjät todella huomaavat. Harjoittelet Itsenäinen mobiilisovelluskehitys-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Itsenäinen mobiilisovelluskehitys-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Itsenäinen mobiilisovelluskehitys-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 4/4.

Kuinka kauan ”Suorituskyvyn ja koetun nopeuden suunnittelu”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Itsenäinen mobiilisovelluskehitys-oppitunnilla?

Kyllä. Jokainen Itsenäinen mobiilisovelluskehitys-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

  1. Edistyneet käyttöliittymäkomponentit ja animaatiot
  2. Saavutettavuus ja kansainvälistäminen
  3. Käyttäjäpalaute ja A/B-testauksen perusteet
  4. Suorituskyvyn ja koetun nopeuden suunnittelu
← Takaisin: Itsenäinen mobiilisovelluskehitys