Bu makalede bir web sayfasını bilgisayarınızdaki veya telefonunuzdaki bir web tarayıcısında görüntülediğinizde ne olacağına basitçe bakacağız.
Burada anlatılanlar kısa vadede web kodu yazmak için gerekli olmasa da, uzun süre zarfında arka planda neler olduğunu anlamanız sizin için yararlı olacaktır.
İstemciler ve sunucular
Web’e bağlı bilgisayarlara istemciler (client) ve sunucular (server) denir. Bu ikisinin etkileşimine ait basitleştirilmiş bir diyagram şöyle görünebilir:
- İstemciler, tipik web kullanıcısının internete bağlı cihazları (örneğin, Wi-Fi’nize bağlı bilgisayarınız veya mobil ağınıza bağlı telefonunuz) ve bu cihazlarda bulunan web erişim yazılımıdır (genellikle Firefox veya Chrome gibi bir web tarayıcısı).
- Sunucular web sayfalarını, siteleri veya uygulamaları depolayan bilgisayarlardır. Bir istemci aygıt bir web sayfasına erişmek istediğinde, web sayfasının bir kopyası kullanıcının web tarayıcısında görüntülenmek üzere sunucudan istemci makineye indirilir.
Diğer öğeler
Yukarıda anlattığımız istemci ve sunucu tüm hikayeyi anlatmıyor. İşin içinde başka birçok parça var.
Şimdilik, web’in bir yol olduğunu hayal edelim. Yolun bir ucunda istemci var – mesela sizin eviniz. Yolun diğer ucunda ise, bir şey satın almak istediğiniz bir dükkan var – bu da sunucu.
İstemciye ve sunucuya ek olarak, aşağıdakilere de merhaba dememiz gerekir:
- İnternet bağlantınız: Web’de veri göndermenizi ve almanızı sağlar. Evinizle dükkan arasındaki sokak gibi.
- TCP/IP: İletim Denetimi Protokolü ve Internet Protokolü, verilerin internet üzerinden nasıl seyahat etmesi gerektiğini tanımlayan iletişim protokolleridir. Bu, sipariş vermenize, dükkana gitmenize ve mallarınızı satın almanıza izin veren ulaşım mekanizmaları gibidir. Örneğimizde, bu bir araba veya bisiklet olabilir (veya başka bir şekilde dolaşabilirsiniz).
- DNS: Etki Alanı Adı Sunucuları web siteleri için bir adres defteri gibidir. Tarayıcınıza bir web adresi yazdığınızda, tarayıcı web sitesini almadan önce web sitesinin gerçek adresini bulmak için DNS’ye bakar. Tarayıcının web sitesinin hangi sunucuda yaşadığını bulması gerekir, böylece HTTP mesajlarını doğru yere gönderebilir (aşağıya bakın). Bu, dükkanın adresine bakmak gibi, böylece ona erişebilirsiniz.
- HTTP: Köprü Metni Aktarım Protokolü, istemcilerin ve sunucuların birbirleriyle konuşmaları için bir dil tanımlayan bir uygulama protokolüdür. Bu, mallarınızı sipariş etmek için kullandığınız dil gibidir.
- Bileşen dosyaları: Bir web sitesi, dükkandan satın alacağınız malların farklı bölümleri gibi birçok farklı dosyadan oluşur. Bu dosyalar iki ana türde gelir:
- Kod dosyaları: Web siteleri öncelikle HTML, CSS ve JavaScript’ten oluşturulur. Diğer teknolojilerle daha sonra tanışırsınız.
- Varlıklar: Bu, resimler, müzik, video, Word belgeleri ve PDF’ler gibi bir web sitesini oluşturan diğer tüm şeylerin toplu adıdır.
Peki tam olarak ne olacak?
Tarayıcınıza bir web adresi yazdığınızda (mağazaya yürümek gibi bir benzetme için):
- Tarayıcı DNS sunucusuna gider ve web sitesinin üzerinde yaşadığı sunucunun gerçek adresini bulur (mağazanın adresini bulursunuz).
- Tarayıcı, sunucuya bir HTTP istek mesajı gönderir ve web sitesinin bir kopyasını müşteriye göndermesini ister (mağazaya gider ve mallarınızı sipariş edersiniz). Bu ileti ve istemci ile sunucu arasında gönderilen diğer tüm veriler, TCP/IP kullanılarak internet bağlantınız üzerinden gönderilir.
- Sunucu istemcinin isteğini onaylarsa, sunucu istemciye “200 Tamam” iletisi gönderir, bu da “Elbette bu web sitesine bakabilirsiniz! İşte burada” mesajıdır. Ve sonra web sitesinin dosyalarını veri paketleri adı verilen bir dizi küçük parça olarak tarayıcıya göndermeye başlar (dükkan size mallarınızı verir ve onları evinize geri getirirsiniz).
- Tarayıcı küçük parçaları eksiksiz bir web sayfasına birleştirir ve size görüntüler (mallar kapınıza gelir – yeni ve parlak şeyler, harika!).
Bileşen dosyalarının ayrıştırıldığı sıra
Tarayıcılar sunuculara HTML dosyaları için istek gönderdiğinde, bu HTML dosyaları genellikle dış CSS stil sayfalarına başvuran
<link> öğeleri ve harici JavaScript komut dosyalarına başvuran
<script> öğelerini içerir. Tarayıcı sayfayı yüklerken bu dosyaların tarayıcı tarafından ayrıştırılmış sırasını bilmek önemlidir:
- Tarayıcı önce HTML dosyasını ayrıştırır ve bu da tarayıcının dış CSS stil tablolarına yapılan tüm öğe başvurularını (
<link>) ve komut dosyalarına yapılan tüm öğe başvurularını (
<script>) tanımasına yol açar.
- Tarayıcı HTML’yi ayrıştırırken, öğelerden bulduğu tüm CSS dosyaları ve öğelerden bulduğu JavaScript dosyaları için sunucuya istek gönderir ve bunlardan CSS ve JavaScript’i ayrıştırır.
- Tarayıcı, ayrıştırılan HTML’den bellek içi bir DOM ağacı oluşturur, ayrıştırılmış CSS’den bellek içi bir CSSOM yapısı oluşturur ve ayrıştırılmış JavaScript’i çalıştırır.
- Tarayıcı DOM ağacını oluşturur ve stilleri CSSOM ağacından uygular ve JavaScript’i yürütürken, sayfanın görsel bir gösterimi ekrana boyanır ve kullanıcı sayfa içeriğini görür ve onunla etkileşime girmeye başlayabilir.
DNS nedir?
Gerçek web adresleri, en sevdiğiniz web sitelerini bulmak için adres çubuğunuza yazdığınız güzel, unutulmaz kelimeler değildirler. Bunlar şuna benzeyen özel sayılardır:
188.8.131.52
Buna IP adresi denir ve web’de benzersiz bir konumu temsil eder. Ancak, hatırlamak çok kolay değil, değil mi? Bu nedenle Alan Adı Sunucuları icat edilmiştir. Bunlar, tarayıcınıza yazdığınız bir web adresini (“mozilla.org” gibi) web sitesinin gerçek (IP) adresiyle eşleştiren özel sunuculardır.
Web sitelerine doğrudan IP adresleri üzerinden ulaşılabilir. Bir web sitesinin IP adresini aşağıdaki gibi bir aracı kullanarak bulabilirsiniz: IP Denetleyicisi.
Veri paketleri nedir?
Daha önce, verilerin sunucudan istemciye gönderildiği biçimi tanımlamak için “paketler” terimini kullandık. Peki bu ne demek? Temel olarak, veriler web üzerinden gönderildiğinde, binlerce küçük parça halinde gönderilir. Verilerin küçük paketlerde gönderilmesinin birden çok nedeni vardır. Örneğin bazen paketler düşerler veya bozulurlar ve bu olduğunda küçük parçaları değiştirmek daha kolaydır. Ayrıca, paketler farklı yollar boyunca yönlendirilebilir, bu da alışverişi daha hızlı hale getirir ve birçok farklı kullanıcının aynı web sitesini aynı anda indirmesine izin verir. Her web sitesi tek bir büyük parça olarak gönderildiyse, aynı anda yalnızca bir kullanıcı indirebilir, bu da web’i çok verimsiz ve kullanımı çok eğlencesiz hale getirirdi.