Tek sayfa web uygulaması kurmanın avantajları ve dezavantajları [kapalı]


52

Üzerinde çalıştığım bir yan proje için bir prototipleme / kavram aşaması kanıtı sonuna yaklaşıyorum ve daha büyük ölçekli uygulama tasarım kararlarına karar vermeye çalışıyorum. Bu uygulama çevik gelişim sürecine yönelik olarak uyarlanmış bir proje yönetim sistemidir. Vermem gereken kararlardan biri, geleneksel bir çok sayfalı başvuru ile mi yoksa tek sayfalı bir başvuru ile mi gideceğimiz.

Şu anda prototipim geleneksel bir çok sayfalı kurulum, ancak Javascript (jQuery) koduma bir yapı temizleyip uygulamak için backbone.js dosyasına bakıyorum. Backbone.js çok sayfalı uygulamalarda kullanılabileceği gibi görünüyor, tek sayfalı uygulamalarla daha da parlıyor. Tek sayfa uygulama tasarım yaklaşımı kullanmanın avantaj ve dezavantajlarının bir listesini bulmaya çalışıyorum. Şimdiye kadar var:

Avantajları

  • Tüm verilerin bir çeşit API üzerinden erişilebilir olması gerekir - bu, uygulamam için zaten bir API olmasını istediğim için kullanım durumum için büyük bir avantaj. Şu anda veri alma / güncelleme çağrımın yaklaşık% 60-70'i bir REST API üzerinden yapılıyor. Tek sayfalık bir uygulama yapmak, uygulamanın kendisi kullanacağından REST API'mi daha iyi test etmeme izin verecek. Ayrıca, uygulama büyüdükçe, uygulamanın kullandığı şey olduğundan API'nın kendisi de büyüyeceği anlamına gelir; API'yi uygulamaya ek olarak tutmanıza gerek yok.

  • Daha duyarlı uygulama - ilk sayfadan sonra yüklenen tüm veriler minimumda tutulduğundan ve kompakt bir biçimde (JSON gibi) iletildiğinden, veri istekleri genellikle daha hızlı olmalı ve sunucu biraz daha az işlem yapacaktır.

Dezavantajları

  • Kodun tekrarı - örneğin, model kodu. Javascript'te hem sunucu tarafında (bu durumda PHP) hem de istemci tarafında modeller oluşturmak zorunda kalacağım.
  • Javascript'te iş mantığı - Bunun neden kötü olacağı konusunda somut örnekler veremem fakat Javascript'te kimsenin okuyabileceği iş mantığına sahip olmak bana doğru gelmiyor.
  • Javascript bellek sızıntısı - sayfa hiçbir zaman yeniden yüklenmediğinden, Javascript bellek sızıntısı olabilir ve bunların nerede hata ayıklamaya başlayacağını bile bilemem.

İki ucu keskin kılıç olan başka şeyler de var. Örneğin, tek sayfa uygulamalarında, her bir istek için işlenen veriler, uygulama belirli bir istek için ihtiyaç duyduğu minimum veriyi isteyeceğinden çok daha az olabilir, ancak bunun için çok daha küçük bir istek olabileceği anlamına gelir. sunucu. Bunun iyi ya da kötü bir şey olup olmadığından emin değilim.

Projem için hangi yöne gitmem gerektiğine karar verirken göz önünde bulundurmam gereken tek sayfalık web uygulamalarının avantaj ve dezavantajları nelerdir?


Basecamp , basecamphq'in yeni sürümü, tek sayfa kurulum IMO'su ile oldukça iyi bir iş çıkarıyor.
Hakan Deryal

Krom yığın denetçisi ile bellek sızıntılarını bulabilirsiniz: gent.ilcore.com/2011/08/finding-memory-leaks.html
Joeri Sebrechts

Yanıtlar:


17

En büyük dezavantajı, istemcinin JavaScript’i etkinleştirmiş ve adil bir miktar çalıştırmak için yeterince güçlü olması gerektiğidir. Ayrıca, erişilebilirlik kaygılarını veya statik HTML'yi ayrıştırmaya dayanan başka herhangi bir şeyi karşılamak daha zordur (yine de, belirli API'nizi bilen bir şey muhtemelen HTML kazıma işleminden daha iyi yapabilir). Son olarak, önemli bellek sızıntılarına sahip olmak daha kolaydır.

İstemciye kod kopyalamak veya iş mantığı koymak kadar - Bunun ne kadarını yapmanız gerektiğinden emin değilim. İstemcideki model bir Görünüm Modeliyse (UI'nin gördüğü şekilde dünyayla eşleşen bir iş modeli değil, iş modeli değil), ViewModel'i iş modeliyle eşleştiren mantık istemcide bulunabilir. sunucu veya ikisinden de biraz. Bu, API’nizin müşteriye özel bir cephe içerdiğine ve müşterinin UI girişlerini API çağrılarına çevirmesini sağlamaya ilişkin hislerinize bağlıdır.

Ayrıca knockout.js dosyasına da bakmak isteyebilirsiniz. Omurgadan daha iyi olup olmadığını söyleyemem, ancak projenize daha uygun olabilir.


Evet, orada kod çoğaltmanın çoğunun olacağına inanıyorum, veri doğrulama doğru. Bu projenin erişilebilirliği ile ilgilenmediğim için javascript'in etkinleştirilmesi gerekliliğine sahip olduğum için iyiyim (ekran okuyucusu ve ne olmadığı gibi). Javascript hafızasına gelince, benim sorunum olan, benim sorumun yorumunda verilen bağlantıyla, gerçekten de bunu (bu benim birincil gelişim tarayıcım olan krom) olumsuz etkiliyor.
ryanzec

7

Tek Sayfa Web Uygulamalarında sıkça gördüğüm dezavantajlar:

  • Sitenin belirli bir bölümüne bağlanamama, genellikle sadece 1 giriş noktası vardır.
  • İşlevsel olmayan geri ve ileri düğmeleri.
  • Tırnakların kullanımı sınırlıdır veya dayanılmazdır.

(özellikle mobil :)

  • Yüklemesi çok uzun sürüyor.
  • Hiç çalışmıyor.
  • Bir sayfa yeniden yüklenemiyor, ani bir ağ kaybı sizi sitenin başlangıcına geri götürüyor.

Bunların hepsi etrafta çalışılabilir, ancak gördüğüm kadarıyla, site yapımcılarının çoğu yok.


9
1,2 ve 6, temelde aynı sorunun sadece belirtileridir. Oluşturan tarihçe API / karma bağlantısını kullanmaz.
Martin Hansen

11
Bu cevap modası geçmiş, Çoğu tek sayfalı uygulama çerçevelerinin yukarıdaki sorunların üstesinden
Luis

@Luis teknoloji varken, çok sık kullanılmaz.
Pieter B,

5

Javascript'i hiç çalıştırmayan çok önemli bir müşteri var: Google tarayıcısı (2012 itibariyle) . (Bing’ler de JS’leri çalıştırmıyor sanırım.)

Dizine alınması gereken her sayfanın AJAX olmayan makul bir sürümünü veya dizine alınması gereken bir sayfaya bağlantı vermeniz gerekir.

Siteniz küçükse, yalnızca endekslemek için birkaç sayfanın çok temel versiyonlarını sağlayabilirsiniz.

Sitenin içeriğinin çoğu yalnızca kayıtlı kullanıcılar içinse veya başka nedenlerden dolayı dizine eklenmesi gerekmiyorsa, dizine eklenmemiş tüm alanı tek bir sayfalık uygulama olarak, kendi aramanız, blackjack, vb.

Bunların hiçbiri değilse, muhtemelen en başından itibaren çok sayfalı bir site geliştirmek ve sayfanın "genel amacını" değiştirmeyen AJAX güncellemelerini sağlamaktan daha iyisinizdir.


4
Googlebot şimdi biraz Javascript okuyor ve hatta yürütüyor. Bkz googlewebmastercentral.blogspot.com/2011/11/...
jfrankcarr

2
Bu özel soru için, bu bir proje yönetimi uygulaması. Muhtemelen bir SEO layık site değil.
Ürdün

SEO anonim erişime izin verecek şekilde yapılandırılabildiğinden SEO bireysel sorunlara sahip olmak güzel olsa da çoğu sayfa için büyük bir endişe değildir (böylece bir kullanıcı ürünle ilgili bir sorunu çözerse, onunla ilgili sorunu izleyicide bul).
ryanzec

1
2015 Güncellemesi: Google gelmez JS yürütmek
rinogo

3

-Kodun tanıtılması - Örneğin, model kodu. Javascript'te hem sunucu tarafında (durumda PHP) hem de sunucu tarafında modeller oluşturmak zorunda kalacağım.

PHP dünyasındasın ama otomatik olarak JavaScript WCF proxy'leri oluşturmak için .NET dünyasında kod oluşturma stratejileri var. Buraya bak

Bir PHP uygulamasında uzak nesnelerinizi JavaScript'te kendiniz oluşturmak zorunda olmamak için hangi seçeneklerin mevcut olabileceğini bilmiyorum, ancak bu, .NET'te tek sayfa uygulamaları yazan kişiler için bir seçenektir.


0

Seçim, biri ya da diğeri olmak zorunda değildir. JWt örneğin, çok sayfalı bir web sayfasının mükemmel yanılsamasını uygulayan bir web araç takımıdır, ancak tek bir sayfadır. Ayrıca, javascript'e sahip olmayan google botları ve tarayıcıları tanıyacak (deneyecek) ve algıladığında geleneksel çok sayfalı modele geçecektir.

Kısacası:

  • API yazmanıza gerek yok (ancak isterseniz hala yapabilirsiniz)
  • Duyarlı uygulama: Her kullanıcı en fazla bir sunucu gidiş-dönüşüne ihtiyaç duyar (ayrıca fotoğraf çekmek)
  • kod tekrarı yok
  • iş mantığı yok müşteri tarafı
  • minimal karmaşıklık istemci tarafı
  • arama botları endeksleyebilir

1
JWt bir java araç takımıdır. Soru PHP ile ilgili.
Joeri Sebrechts
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.