SORU
10 EYLÜL 2011, CUMARTESİ


Erişilebilirlik ve tüm bu JavaScript çerçeveleri

Bir süre Backbone.js ve Batman.js gibi JavaScript çerçevesinden bir kaç araştırıyorum ve gerçekten çok beğendim ederken, geri gelmesini sağlayacak bir detaycı şey var. Bu sorun, erişilebilirlik.

Bir web geliştirici olarak her zaman akılda erişilebilirlik, ilerici geliştirme fikri kullanarak özellikle web siteleri ve uygulamaları yapmaya çalıştım.

Açıkça kutudan yeni JS bu çerçeveler bu konuda diğer geliştiriciler düşünceleri ne merak ediyor ve bu konuda ne yapıyorsunuz ben çok incelikle aşağılamak, yok. Sonuçta bir web sitesi / app erişilebilirlik birçok ülkede hukukun bir parçası olarak isteğe bağlı bir şey değil.

Belki de bu konuda aşırı istekli olmak, ve ne kadar erişilebilirlik açısından gelmediler takdir ediyorum.

CEVAP
10 EYLÜL 2011, CUMARTESİ


En son benim sitedeki js-çerçeve (benim durumumda spine.js ) kullanıyorum. Hala non-js tarayıcılar (kesinlikle aşırı gayretli: SEO sanırım) benim sitesine gidin ve içeriği sindirimi emin olun.

Örnek olarak bir arama sayfasında gösterilen ürünler olmak ile birlikteyim. Ürünlerimiz disk filtre, sıralama. Tabii ki bu genel bir fikir örneğidir.

ÜNİTELERİ: sunucu tarafı hem de işleyebilen bir şablon motoru ve istemci tarafı. (Bıyık kullanıyorum) . Bu js - sunucu tarafında bir şablon oluşturma, ve js ile render modelleri istemci tarafı üzerinden, şablon olmayan modeller oluşturabilirsiniz.

  1. Ürünler sunucu tarafı kullanarak bıyık-şablon oluşturma. başlangıçta: Ayrıca bir 'bootstrapJSON'JSON formatında aynı ürünleri içeren nesne.

  2. Başlangıçta tüm bağlantılar (ürün detay sayfası, çağrı, sıralama, filtreleme)-yan sunucu URL (hashbang URL) gerçek

  3. Son sonuç belleği ile 0, JS kullanmadan sıralama gezindiği bir sayfa.

  4. tüm çağrı, URL filtreleme, sıralama sırayla ürünleri işlenmiş yeni bir sonucu sunucuya bir istek neden. Özel bir şey yok burada.

  5. JS-etkin - domload:

    • bu bootstrapJSON getirme ve ürün-model (js-çerçeve özellikleri bunu yapmak için kullanın) .
    • Daha sonra ürünleri bıyık-şablonu kullanarak ama şimdi istemci tarafı yapıyor rerender. (Tekrar js-çerçeve kullanarak).
    • Görsel olarak hiçbir değişiklik gösterebilir (sonra tüm sunucu tarafı ve istemci tarafı işleme yapılan şey, aynı model, aynı şablonu), ama en azından şimdi bir bağlama arasındaki istemci tarafı modeli ve görünümü.
    • hashbang-URL için URL dönüştürmek. (e.g:/#/ürün sıralama-price-asc ) ve js-çerçeve özellikleri olayları göndermek için kullanıyor.
  6. şimdi her (filtreleme, çağrı, sıralama ) url gerektiği sonucu bir istemci tarafı devlet değiştirmek, ki muhtemelen neden senin js-çerçeve yaparken bir ajax isteği sunucuya geri yeni ürünler (JSON formatında) . Yine bu istemci üzerinde yeniden işlenmesinden, güncelleştirilmiş bir görünüm neden.

  7. Kod mantık kısmı ajax isteği 6 işlemek için. sunucu tarafı 0 kod 4'te kullanılan aynı. Ajax-arama ve sıradan bir talep arasında ayrım ve JSON veya html (sunucu tarafı bıyık kullanarak) ürünler sırasıyla tükürdü.

EDİT: UPDTATE JAN 2013 Bu soru/cevap biraz makul ilgi çekiyor beri yakından ilgili aha-anlar son yılın: paylaşayım dedim

  • Dışarı JSON tükürme ve işleme istemci tarafı istemci tarafı tercih mvc (6 adımları. ve 7. yukarıda oldukça pahalı cpu-bilge olabilir. Bu, tabii ki, mobil cihazlar, özellikle belirgindir.

  • Yukarıdaki cevabımı önerilen istemci tarafı aynı yapmak yerine ajax, html-parçacıkları (sunucu tarafı bıyık-şablon oluşturma kullanarak) dönmek için bazı testler yaptım. Eğer istemci-aygıta göre 10 kat daha hızlı (1000ms ->olabilir 100 MS civarında) , elbette sizin kilometre değişebilir. (hemen hemen hiç kod değişikliği gerekli, 7 adım beri. olabilir zaten ikisi de yok)

  • Hayır JSON istemci tarafı bir MVC model inşa etmek için yolu vardır hayır döndüğünde elbette, olaylar, vb yönetmek. Neden, bir istemci tarafı MVC olmasın? Dürüst olmak gerekirse, biraz geç oldu hatta çok karmaşık searchpages ile client-side mvc ... ... hiç bir yararı yok. Benim için tek gerçek yararı açıkça istemci mantığı ayırmak için yardımcı olur, ama zaten kendi ımho yapman gerekir. Sonuç olarak, istemci tarafı sıyırma MVC yapılacak.

  • Evet, Hogan ile Bıyık (aynı sözdizimi, biraz daha fazla işlevsellik, ama son derece ölçülebilir en önemlisi!) değiştirdim Node.js kayalar ımho) java arka uç değiştirdim . çünkü bunu yapmak mümkün oldu

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • lissaandbeauty

    lissaandbeau

    24 Aralık 2011
  • Matt Davis

    Matt Davis

    4 ŞUBAT 2006
  • spectragirlz16's channel

    spectragirlz

    22 Ocak 2012