İç çerçeveler 'kötü uygulama' olarak mı değerlendirilir? [kapalı]


287

Hat boyunca bir yerde iframe kullanmanın 'kötü uygulama' olduğu fikrini aldım.

Bu doğru mu? Bunları kullanmanın artıları / eksileri nelerdir?

Yanıtlar:


217

Tüm teknolojilerde olduğu gibi iniş ve çıkışları vardır. Düzgün geliştirilmiş bir siteyi dolaşmak için bir iframe kullanıyorsanız, o zaman elbette kötü bir uygulamadır. Ancak bazen bir iframe kabul edilebilir.

Bir iframe ile ilgili ana sorunlardan biri yer imleri ve gezinme ile ilgilidir. Bir sayfayı içeriğinizin içine gömmek için kullanıyorsanız, bence bu iyi. Bir iframe bunun için.

Ancak iframe'lerin de istismar edildiğini gördüm. Hiçbir zaman sitenizin ayrılmaz bir parçası olarak değil, bir site içindeki bir içerik parçası olarak kullanılmamalıdır.

Genellikle, iframe olmadan yapabilirseniz, bu daha iyi bir seçenektir. Eminim buradaki diğerlerinin daha fazla bilgi veya daha spesifik örnekleri olabilir, hepsi çözmeye çalıştığınız soruna geliyor.

Bununla birlikte, HTML ile sınırlıysanız ve PHP veya ASP.NET gibi bir arka uca erişiminiz yoksa, bazen bir iframe tek seçeneğinizdir.


23
"HTML ile sınırlıysanız ve PHP veya ASP.NET gibi bir arka uca erişiminiz yoksa, bazen bir iframe tek seçeneğinizdir" ... bu doğru değil. Jquery ajax aracılığıyla veri alıp bu verilerle bir div doldurarak sayfanıza harici içerik yerleştirebilirsiniz.
developer747

54
@ developer747 - Aynı içerik politikası nedeniyle harici içerik başka bir sitede bulunuyorsa çalışmaz . Bazı belirsiz durumlarda, uzak site JSONP'yi destekleyebilir ; ama muhtemelen değil.
Peter V.Mørch

2
İç çerçeveler kullanıcı tarafından yeniden boyutlandırılamadığı için iframe'lerin eski çerçeve kümesinden çok daha az kullanışlı olduğunu hissediyorum - ancak artık html5'te bulunmadığından bir el kitabı dışında hiçbir şey için bir çerçeve kümesi kullanmazdım. Örnek: Game maker kılavuzu
Domino

15
İç içe geçmiş bir CSS kapsamını tanımlamanın tek yolunun iframe'lerin şu anda olduğu belirtilmelidir. İç işaretlemeyi, düzeni, stili ve Javascript'i * birçok kullanım durumunda ve uygulamada yararlı olan dış belgeden ayırırlar. * İç belgenin dış belgeyle orijini paylaşması halinde Javascript yalıtılmaz; Öte yandan, farklı kökenlerden gelen dokümanlar window.postMessage(), örneğin işbirlikçi iframe otomatik yeniden boyutlandırma uygulamak için hala iletişim kurabilir .
Tobia

1
İFrame Kötülük! da yardımcı olabilir
DanielV

75

Kötü bir uygulama değil, sadece başka bir araç ve esneklik katıyorlar.

Standart bir sayfa öğesi olarak kullanmak için ... iyidir, çünkü içeriği birkaç sayfaya ayırmanın basit ve güvenilir bir yoludur. Özellikle kullanıcı tarafından oluşturulan içerik için, iç sayfaları " iframezayıf bir biçimlendirme " içine yerleştirmek ana sayfayı etkilemediğinden faydalı olabilir . Dezavantajı, birden fazla kaydırma katmanı (tarayıcı için, diğeri için iframe) tanıtırsanız, kullanıcılarınızın hayal kırıklığına uğrayacağıdır. Adzm'ın dediği gibi, iframebirincil gezinme için bir kullanmak istemezsiniz , ancak bunları bir videonun veya başka bir medya dosyasının gömülme biçimine eşdeğer bir metin / işaretleme olarak düşünün.

Komut dosyası arka plan olayları için, seçim genellikle gizli iframeve XmlHttpRequestgeçerli sayfa için içerik yükleme arasındadır . Aradaki fark, iframebir sayfanın yük oluşturmasıdır, böylece çoğu tarayıcıda tarayıcı önbelleğinde ileri ve geri hareket edebilirsiniz. XmlHttpRequestHer yerde kullanan Google'ın, iframebelirli durumlarda bir kullanıcının tarayıcı geçmişinde ileri ve geri hareket etmesine izin vermek için de s kullandığına dikkat edin .


11
Iframe'lerin bir alandaki bir sayfayı başka bir alandaki bir sayfaya gömmek için kullanılabileceğinden bahsetmenin önemli olduğunu düşünüyorum. Gömülü sayfa, çerezleri olan kullanıcıları takip etmek ve bu bilgileri ana makine alan adından korumak istiyorsa, tek seçeneğiniz JS ana bilgisayar etki alanının kontrolü altında olduğu için bir iframe kullanmaktır.
Nicholas Leonard

@NicholasLeonard İyi bir örnek, dizin sayfasını alt sayfanın localstorage'da olup olmadığını algılayan bir komut dosyası haline getirerek sayfayı yerel depolama tabanlı önbelleği zorlamak için kullanabilmenizdir. Daha sonra, oradaysa local.torage'dan document.write yazın ve eğer değilse bu alt sayfaya bir iframe ekleyin. Bu alt sayfada, alt sayfa HTML öğesinin outerhtml'sini localstorage içine depolayacak bir komut dosyasına sahip olun. Bu yöntemi kullanmanın GERÇEKTEN iyi bir nedeni, bir yükleme ekranına eklemenize izin vermesidir.

Katılmıyorum, ama aşağı inemiyorum çünkü önemli bir POV.
victorf

28

Bunların dezavantajlarını anlamadan kullanmak kötü bir uygulamadır. Adzm'ın gönderisi onları çok iyi özetliyor.

Flipside, gmail, bazı serin özellikleri (otomatik dosya yükleme gibi) için arka planda iFrames'i yoğun bir şekilde kullanır. İFrames'ın sınırlamalarının farkındaysanız, bunları kullanma konusunda herhangi bir sıkıştırma hissetmeniz gerektiğine inanmıyorum.


18

Onlarla birçok durumda çalıştıktan sonra, gerçekten iframe'lerin goto ifadesinin web programlama eşdeğeri olduğunu düşünmeye başladım. Yani, genellikle kaçınılması gereken bir şey. Bir site içinde biraz yararlı olabilirler. Ancak, siteler arası, neredeyse en basit içerikten başka bir şey için neredeyse her zaman kötü bir fikirdir.

Olasılıkları düşünün ... Parametreli içerik için kullanılıyorsa, bir arayüz oluşturdular. Ve profesyonel bir sitede, bu arayüz bir SLA ve sürüm yönetimi gerektirir - bu da çevrimiçi olmak için hemen her zaman göz ardı edilir.

Etkin içerik için kullanıldığında - komut dosyasını barındıran çerçeveler - (farklı) alanlar arası komut dosyası kısıtlamaları vardır. Bazıları hacklenebilir, ancak nadiren tutarlı bir şekilde. Çerçeveli içeriğinizin etkileşimli olması gerekiyorsa, bunu çerçevenin ötesinde yapmakta zorlanacaktır.

Lisanslı içerikle kullanılırsa, katılımcı siteler, yetkilendirme bilgilerinin toplantı sahipleri arasında bant dışına taşınması gereği ile yükümlüdür.

Bu nedenle, bir site içinde zaman zaman yararlı olsa da, bunlar mashuplar için uygun değildir. Gerçek portallara ve portletlere bakmak çok daha iyi. Daha da kötüsü, her web amatörünün sevgilisi - birçok teknik yöneticisi birçok soruna bir çözüm olarak onlara el koydu. Aslında daha fazlasını yaratırlar.


10

Deneyimlerime dayanarak, iframe için olumlu bir taraf , üçüncü taraf kodlarını çağırırken, bir Document.write();komut içeren bir javascript çağrılmasını içerebilir . Bildiğiniz gibi, bu komutlar nasıl ayrıştırıldığından (DOM Ayrıştırıcı vb.) Zaman uyumsuz olarak çağrılamaz. Bunun bir örneği http://sourceforge.net/projects/phpadsnew/ Phpadsnews için birden fazla çağrı yapıldığı ve sitenin farklı işlemeye geçmeden önce yanıtı beklediği için sitemizi hızlandırmak için iframe'ler kullandım. Sayfanın bazı bölümleri. iframe ile sitenin sayfanın diğer bölümlerini oluşturmasına izin verdim ve yine Document.write()de phpad'lerin komutunu eşzamansız olarak çağırıyorum. Önleme ve js kilitleme.


8

İframe millet için kesinlikle kullanır. Hava durumu ağları widget'ını sayfanıza başka nasıl yerleştirirsiniz? Diğer tek yol XML'lerini alıp ayrıştırmaktır, ancak elbette ilgili hava grafiklerini atmak için koşullara ihtiyacınız var ... gerçekten buna değmez, ancak zamanınız varsa daha temiz.


6

Orijinal çerçeve kümesi modeli (Çerçeve kümesi ve Çerçeve öğeleri) kullanılabilirlik açısından çok kötüydü. IFrame vas, orijinal çerçeve seti modeli kadar problemi olmayan ancak dezavantajı olan daha sonraki bir buluş.

Kullanıcının IFrame içinde gezinmesine izin verirseniz, bağlantılar ve yer işaretleri beklendiği gibi çalışmaz (çünkü dış sayfanın URL'sini işaretlediğinizden, iframe'in URL'sini işaretlemediğiniz için).


1
katılmıyorum ... bunun gibi geniş bir yorum hiç de nitelikli değil.
Dawesi

5

Ana sayfanız HTTP protokolüne yüklendiğinde ve sayfanızın bazı bölümlerinin HTTPS protokolünde çalışması gerektiğinde, iFrame jsonp ellerini yenebilir.

Özellikle, dataType yerel olarak json değilse ve sunucuda json'a çevrilmesi ve istemcide örneğin karmaşık html'ye çevrilmesi gerekiyorsa.

Yani hayır - iFrame kötü değil.


5

Onlar kötü değil, ama aslında yararlı. Bir süre önce twitter feed'imi gömmek zorunda kaldığım büyük bir sorun yaşadım ve md'nin aynı sayfada yapmasına izin vermedi, bu yüzden farklı bir sayfaya ayarladım ve bir iframe olarak koydum.

Ayrıca tüm tarayıcılar (ve telefon tarayıcıları) destekliyorlar. Doğru kullandığınız sürece kötü bir uygulama olarak kabul edilemezler.


4

Kullanıcılarınızın internet bağlantısının hızından veya iframe'in içeriğinden bağımsız olarak iframe'lerin sayfanızın indirdiği hızda küçük (0,3 sn veya daha fazla) ancak gözle görülür bir yavaşlamaya neden olacağını belirtmek gerekir. Bu, yerel olarak test ederken göreceğiniz bir şey değil. Aslında, bu bir sayfaya eklenen herhangi bir öğe için geçerlidir, ancak iframe'ler daha kötü görünüyor.


1
Neden? Ve ana sayfa yükleme tamamlandıktan sonra iframe'lerin yüklenmesini sağlamanın bir yolu var mı?
Nicholas Leonard

3
Neden bu kadar yavaş olduklarını hatırlamıyorum; Bunu bir yıl önce araştırıyordum. Muhtemelen tarayıcı temel olarak her iframe için tamamen yeni bir oluşturma içeriği oluşturuyor. Sayfa yükleme tamamlanıncaya kadar yüklenmemelerine gelince, boş bir iframe kullanabilir ve ardından sayfa yükleme tamamlandıktan sonra iframe'in src etiketini ayarlayabilirsiniz. Bununla birlikte, boş bir iframe'in bile indirme işlemine rağmen sayfanızın oluşturulmasını yavaşlatacağını unutmayın, bu nedenle işler kullanıcılarınıza biraz daha yavaş görünecektir.
Brian

3
Aksine, hız ve iFrame'lere başvururken CDN'yi (İçerik Dağıtım Ağları) tartışmak düşünülebilir. İFrame'in kaynakları paralel olarak indirebileceğini ve bu nedenle (tarayıcıya bağlı olarak) hız artışı sağlayabileceğini düşünün. İşte benim konumumla aynı fikirde olan en az bir referans daha. developer.yahoo.com/performance/rules.html
Strixy

2
@Strixy: Belirttiğiniz URL, IFrame'lerin boş olsa bile maliyetli olduğunu belirtir. IFrames kullanımını en aza indirmenizi önerir. Sitenizi hızlandırmak için bir CDN kullanmak IFrame'leri kullanmakla dikeydir. Bir CDN, bir IFrame kullanmanın maliyetini azaltmaya yardımcı olabilir. Ancak, IFrame içermeyen CDN, CDN ve IFrame'den daha iyidir.
Brian

1
@Strixy: Kaynakları paralel olarak indirmek istiyorsanız, bunu yapmanın daha iyi yolları vardır. Eski sıcaklık, tüm bu şeyleri javascript aracılığıyla yüklemektir. Yeni özellik, kullanıcı aracısının istemci kaynaklarını mantık kullanarak site kaynaklarını nasıl yüklediğini, önyüklediğini ve önbelleğe aldığını doğrudan yönetmenizi sağlayan bir Hizmet çalışanı kullanmaktır. Diğer yeni özellik, tarayıcının istemesini beklemeden tarayıcıya kaynak göndermenizi sağlayan http / 2 push'tur. Ancak, http / 2 önbelleği diğer tarayıcı önbelleklerinden sonra kontrol edildiğinden, bu amaç için genellikle kötü bir seçimdir.
Brian

3

IFRAME'lerin dinamik bağlam menüleri oluşturmanın kolay bir yolu olarak çok başarılı bir şekilde uygulandığını gördüm, ancak bu web uygulamasının hedef kitlesi yalnızca Internet Explorer kullanıcılarıydı.

Her şeyin gereksinimlerinize bağlı olduğunu söyleyebilirim. Sayfanızın her tarayıcıda eşit derecede iyi çalıştığından emin olmak istiyorsanız, IFRAME'lerden kaçının. Dar ve iyi bilinen bir kitleyi hedefliyorsanız (ör. Yerel Intranet'te) ve IFRAME'leri kullanmanın bir faydasını görürseniz, bunu yapmanın uygun olduğunu söyleyebilirim.

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.