Qiymətləndirmə sənədləri ilə real dünya müqayisəsi (2018 yeniləmə)

YENİLƏNİB: Bu yazının daha yeni bir versiyası var

Bu məqalə, 2017-ci ilin dekabr ayından etibarən Cəbhə Çərçivələri Həqiqi Dünyanın Müqayisə etmə meyarları ilə təzədir.

Bu müqayisədə, demək olar ki, eyni RealWorld nümunə tətbiqetmələrinin fərqli tətbiqlərinin bir-birlərinə qarşı necə dayandığını göstərəcəyik.

RealWorld nümunə tətbiqi bizə verir:

  1. Real Dünya Tətbiqi - "todo" dan başqa bir şey. Adətən "todos" əslində real tətbiqlər qurmaq üçün kifayət qədər bilik və perspektiv göstərmir.
  2. Standartlaşdırılmış - Müəyyən qaydalara uyğun bir layihə. Arxa tərəfli API, statik işarələmə, üslub və spesifik təmin edir.
  3. Bir mütəxəssis tərəfindən yazılmış və ya nəzərdən keçirilmiş - Bu texnologiyanın mütəxəssisi tərəfindən qurulmuş və ya nəzərdən keçiriləcəyi ardıcıl, həqiqi bir dünya layihəsidir.

Son versiyadan gələn tənqid (Dekabr 2017)

️ Bucaq istehsalda deyildi. RealWorld repo-da sadalanan demo tətbiqi inkişaf versiyasından istifadə edirdi, amma Jonathan Faircloth sayəsində indi istehsal versiyasındadır!

Vue Real Dünya repolarına daxil edilmədi və beləliklə də daxil edilmədi. Güman etdiyiniz kimi, ön cəbhədə bu, çox istiliyə səbəb oldu. Niyə Vue əlavə etmədin? Ne heck senin yaninda deyil? Bu dəfə Vue.js ətrafında! Təşəkkür edirəm Emmanuel Vilsbol.

Hansı kitabxanaları / çərçivələri müqayisə edirik?

2017-ci ilin dekabr məqaləsində olduğu kimi RealWorld repo-da sadalanan bütün tətbiqləri daxil etdik. Böyük bir təqibin olub-olmamasının əhəmiyyəti yoxdur. Yeganə ixtisas, RealWorld repo səhifəsində görünməsidir.

Https://github.com/gothinkster/realworld-da ön xətlər (Aprel 2018)

Hansı ölçülərə baxırıq?

  1. Performans: Bu Tətbiq məzmun göstərmək və istifadəyə yararlı olmaq üçün nə qədər vaxt aparır?
  2. Ölçüsü: Tətbiq nə qədər böyükdür? Yalnız tərtib edilmiş JavaScript sənədlərinin ölçüsünü müqayisə edəcəyik. CSS, bütün variantlar üçün ortaqdır və CDN-dən (Content Çatdırılma Şəbəkəsi) yüklənir. HTML də bütün variantlar üçün ortaqdır. Bütün texnologiyalar JavaScript-ni tərtib edir və ya köçürür, beləliklə biz yalnız bu faylı (ölçülərini) ölçürük.
  3. Kod xətləri: müəllifin spesifikasiyalar əsasında RealWorld tətbiqini yaratması üçün neçə sətir sətri lazım idi? Ədalətli olmaq üçün bəzi tətbiqlərdə bir az daha zəng və səs var, lakin bu, əhəmiyyətli dərəcədə təsir göstərməməlidir. Kəmiyyət saydığımız yeganə qovluq src / hər tətbiqdə.

Metrik №1: Performans

Chrome ilə göndərilən Lighthouse Audit ilə ilk mənalı boya testini yoxlayın.

Nə qədər tez rəngləsəniz, Tətbiqdən istifadə edən insan üçün təcrübə bir o qədər yaxşı olar. Mayak da ilk interaktiv ölçür, amma bu əksər tətbiqlər üçün demək olar ki, eynidır və beta vəziyyətindədir.

İlk mənalı boya (ms) - daha yaxşıdır

Yəqin ki, performansa gəldikdə çox fərq görməyəcəksiniz.

Metrik №2: Ölçü

Transfer ölçüsü Chrome şəbəkə nişanından. GZIPed cavab başlıqları üstəgəl server tərəfindən verilən cavab orqanı.

Fayl nə qədər kiçik olsa, yükləmə daha sürətli olur (və təhlil etmək azdır).

Bu, çərçivənizin ölçüsündən, əlavə etdiyiniz əlavə asılılıqlardan və qurma alətinizin kiçik bir dəstə düzəldə biləcəyindən asılıdır.

Transfer ölçüsü (KB) - aşağı daha yaxşıdır

Svelte, Dojo 2 və AppRun olduqca yaxşı bir iş gördüyünü görə bilərsiniz. Elm haqqında kifayət qədər söz deyə bilmərəm - xüsusən də növbəti cədvələ baxanda. Hyperapp'ın necə müqayisə etdiyini görmək istərdim ... bəlkə də növbəti dəfə Jorge Bucaran?

Metrik №3: Kod xətləri

Cloc istifadə edərək hər reponun src qovluğunda kod sətirlərini sayırıq. Boş və şərh xətləri bu hesablamanın bir hissəsi deyildir. Niyə bu mənalıdır?

Təqdimetmə proqram səhvlərini aradan qaldırmaq prosesidirsə, onda proqramlaşdırma onları yerləşdirmə prosesi olmalıdır - Edsger Dijkstra
# kod xətti - azı daha yaxşıdır

Kodun nə qədər az sətri varsa, onda səhv tapmaq ehtimalı daha azdır. Qorumaq üçün daha kiçik bir kod bazanız var.

Sonda

RealWorld Misal Proqramları repolarını yaratdığınız üçün Eric Simons-a və müxtəlif tətbiqetmələr yazan çox sayda iştirakçıya böyük bir təşəkkür edirəm.

Yeniləmə: Anguların istehsal versiyasını təmin etdiyinə görə Jonathan Faircloth-a təşəkkür edirəm.

Bu məqaləni maraqlı gördünüzsə, Twitter və Medium-da məni izləməlisiniz.