One Million Checkboxes’u 650 Milyon İşaretlemeye Ölçeklendiren Teknoloji

650.000.000 onay kutusunu işaretlemek: beklenmedik popülerlikle başa çıkmak

26 Haziran 2024'te One Million Checkboxes (OMCB) web sitesi yayına alındı

• 1 milyon küresel onay kutusuna sahip bir site; bir onay kutusunu işaretlediğinizde bu değişiklik tüm kullanıcılara anında yansıyor
• Yayına alındıktan sonraki 30 dakika içinde binlerce kullanıcı milyonlarca onay kutusunu işaretledi
• Hacker News, /r/InternetIsBeautiful, Mastodon, Twitter gibi yerlerden trafik geldi
• Washington Post ve New York Times'ta da yer aldı
• İlk gün 50 milyondan fazla onay kutusu işaretlendi
• Site kapatılmadan önceki 2 hafta boyunca 650 milyondan fazla onay kutusu işaretlendi

Orijinal mimari

• Onay kutusu durumu 1 milyon bit (125KB) olarak saklanıyordu
• İstemci, onay kutularını render etmek için bir bitset kullanıyor ve işaretleme durumunu sunucuya bildiriyordu
• Sunucu, bitleri güncellemek ve tüm istemcilere yayınlamak için Redis kullanıyordu
• Statik içerik nginx üzerinden sunuluyor, bitset durumu ve WebSocket bağlantıları ise Flask sunucusu üzerinden işleniyordu
• Redis hem durum saklama hem de mesaj kuyruğu görevini üstleniyordu

Ölçeklendirme ilkeleri

• Maliyet sınırı: iflas etmemek için maliyet matematiksel olarak hesaplanarak serverless yerine ölçeklenme tercih edildi
• Kısa vadeli çözümleri kabul etmek: sitenin popülerliğinin geçici olacağı varsayıldı ve hızlı çözümler seçildi
• Basit ve self-hosted teknolojiler kullanmak: yalnızca doğrudan çalıştırılabilen ve debug edilebilen teknolojiler eklendi
• Eğlenceyi ön planda tutmak: para kazanmaktan çok eğlenceye öncelik verildi
• Küresel yapıyı korumak: tüm kullanıcıların değişiklikleri anında görebilmesi için küresel durum korundu

İlk gün: patlayıcı büyüme

• 30 dakika içinde sunucu yükü hızla arttı
• Yükü dağıtmak için ek sunucular ayağa kaldırıldı
• Redis bağlantı sorunlarını çözmek için batch update yaklaşımı getirildi
• Digital Ocean'ın yönetilen Redis instance'ı yükseltildi

Gece boyunca bir plan yoktu

• ITP kampında yüz tanımalı Pacman oyununu sergilemek için plan yapıldı
• Bir iPad götürülerek oradan sunucular ayağa kaldırıldı
• Sunucu adlandırma kuralı zamanla gelişti ve 8 worker VM çalıştırıldı
• Yükü azaltmak için Flask process sayısı düşürüldü ve update batch boyutu artırıldı

Bant genişliği sorunu

• Digital Ocean'ın bant genişliği fiyatlandırması hesaba katılmamıştı
• Durum snapshot sıklığı azaltıldı ve update boyutu küçültüldü
• Saniye başına gönderilen veri miktarını sınırlamak için tc aracı kullanıldı

İkinci gün: büyüme devam etti

• Girdi doğrulaması düzgün yapılmadığı için site çöktü
• Yükü dağıtmak için Redis replikası eklendi
• Flask process'leri sürekli çökünce otomatik yeniden başlatma script'i yazıldı

Eski update sorunu

• İstemcilerin eski update'leri uygulaması nedeniyle durumun yanlış gösterilmesi sorunu ortaya çıktı
• Update sırasını garanti etmek için timestamp eklendi

Go ile yeniden yazım

• Performans mühendisi bir arkadaşla birlikte backend Go ile yeniden yazıldı
• Performans büyük ölçüde iyileşti
• DDOS saldırıları CloudFlare üzerinden savunuldu

Sitenin kapatılması

• Onay kutuları yeterince hızlı şekilde işaret kaldırılmazsa donacak biçimde değiştirildi
• Donma durumu Redis kullanılarak yönetildi
• Site 2 hafta sonra kapatıldı

Öğrenilenler

• "Gerçek" bir backend'e sahip bir sunucunun açık internete ikinci kez dağıtılması deneyimi oldu
• Kısa vadeli çözümleri seçmek iyi bir karardı
• Redis ve nginx'in gücü bir kez daha doğrulandı
• İnsanların anonim olarak etkileşime girdikleri sitelere duyduğu özlem görüldü

GN⁺ özeti

• Bu yazı, bir web sitesinin beklenmedik popülerliği nedeniyle ortaya çıkan teknik sorunları ve bunların nasıl çözüldüğünü ele alıyor
• Redis ve nginx kullanan basit bir mimarinin bile büyük ölçekli trafiği kaldırabileceğini gösteriyor
• Kısa vadeli çözümlerle sorunların hızla çözülüp sitenin nasıl istikrara kavuşturulduğunu anlatıyor
• Go ile yeniden yazım ve CloudFlare üzerinden DDOS savunması gibi çeşitli teknik zorlukları kapsıyor
• Benzer işlevlere sahip projeler arasında Reddit'in /r/Place gibi büyük ölçekli işbirlikçi projeleri bulunuyor

[GN⁺]

Hacker News görüşleri

• Çok sayıda ders ve tarihsel bilgi çıkarılabiliyordu

  • Her türlü kesinti ve arıza noktası ele alınmış, ancak depolama alanı sorunundan bahsedilmemiş
  • Redis'in Lua kullanabildiğini bilmiyordum; bunu ikame durum olarak kullanma fikri ilgimi çekti
  • Bulut servislerinde bant genişliği konusu, fatura aşımını önleyebilecek sert bir limitin olmaması nedeniyle en büyük şikayetlerden biri

• Harika bir yazıydı! Site için tebrikler ama asıl gurur duyulması gereken kısım yazının kendisi

• Siteyi iki günde kurmuş olmak iyi bir tercihmiş

  • Kariyerinin başındaki mühendislerin öğrenmesi gereken önemli bir ders
  • Ölçekleme sorunları, gerçekten sorun olana kadar sorun değildir
  • O noktada bu iyi bir sorundur ve çözmesi de düşünüldüğünden daha zor değildir

• Yakın tarihli ilgili proje:

  • "One Million Checkboxes" - bağlantı - Haziran 2024 (305 yorum)

• Eğlenceli bir proje

  • 6 yıl önce Android'de Pixmap adlı ortaklaşa piksel düzenleme uygulamasını yayınladım
  • Kuyruk kullanarak her olayı PNG görüntüsüne uyguluyorduk ve istemci bağlandığında ilk PNG'yi yüklüyordu
  • Her piksel çizim olayı istemcilere küçük bir nesne olarak gönderiliyordu
  • İlk yüklemede görüntü sıkıştırmasından yararlanılıyor ve değişiklik kümesi çok küçük kalıyordu
  • Her olay günlüğe kaydedildiği için görüntüyü "geri sarma" yapmak mümkün oluyordu
  • demo bağlantısı

• Harika bir yazıydı — bunun maliyetinin ne kadar olduğunu merak ediyorum

• İnsanların sınırlı anonim etkileşimi özlediğine dair inancım doğrulandı

• Backend'e yeni başlayan biri olarak bu proje için daha basit bir alternatif mimari olup olmadığını merak ediyorum

  • Bir milyon durumu barındırıp istemciyle senkronize etmenin daha kolay bir yolu olmasını isterdim
  • Yazıdaki bazı çözümleri anlamakta zorlandım
  • Yazara tebrikler — proje harika

• Müthiş!

  • Sıradaki yazının checkbox'ların istatistiksel analizi olup olmayacağını merak ediyorum
  • Seçtiğim checkbox'ın neredeyse anında kaldırılmış olmasına üzüldüğümü hatırlıyorum

• Oyunun hâlâ canlı olup olmadığını merak ediyorum

  • One Million Checkboxes'a girdiğimde hiçbir şey işaretli değildi ve JS konsolunda yalnızca şu mesaj görünüyordu
  • {"total":0,"totalGold":0,"totalRed":0,"totalGreen":0,"totalPurple":0,"totalOrange":0,"recentlyChecked":false}