WEBGL

SEJARAH

WebGL berasal dari eksperimen Canvas 3D yang dimulai oleh Vladimir Vukićević di Mozilla. Pada tahun
2006, dia menunjukkan prototipe kanvas 3D pertama. Pada akhir 2007, Mozilla dan Opera telah membuat
implementasi mereka sendiri. Kelompok Kerja WebGL didirikan oleh konsorsium teknologi non-profit Grup
Khronos pada awal 2009, dengan partisipasi awal dari Apple, Google, Mozilla, dan Opera, antara lain.
Spesifikasi WebGL versi 1.0 dirilis pada Maret 2011. Ken Russell adalah ketua kelompok kerja pada Maret
2012. Zygote Body dan Google Maps adalah aplikasi WebGL awal.

APA ITU WEBGL

Web Graphics Library adalah kependekan dari WebGL, teknologi web yang memungkinkan akselerasi grafis
3D dalam browser tanpa memasang perangkat lunak tambahan. API WebGL biasanya disebut sebagai API
JavaScript, dan selalu melibatkan elemen HTML5 "canvas".

WebGL adalah teknologi grafis 3D berbasis web yang digunakan untuk membuat dan menampilkan grafik 3D
pada browser. Penggunaan WebGL juga digunakan untuk mempercepat fungsi editor gambar berbasis web
dan efeknya. Untuk dapat menggunakan WebGL pada Google Chrome, Anda perlu mengaktifkannya terlebih
dahulu.

KEGUNAAN WEBGL

WebGL biasanya digunakan untuk desain web dan game 3D berbasis web, tetapi beberapa peneliti juga
menggunakannya untuk tujuan sains. Dalam buku "Cellular Automata", peneliti menggunakan WebGL untuk
mensimulasikan alur Debris. Di sisi lain, dalam makalah "Visualization of molecular structures using state-of-
the-art techniques in WebGL", peneliti mensimulasikan molekul di dalamnya. Untuk merayakan ulang tahun
ketiga pendaratannya di Mars, NASA membuat aplikasi web interaktif yang disebut Experience Curiosity.

FITUR UTAMA WEBGL

• Lintas platform dan lintas browser

• Akselerasi GPU3D
• API asli untuk mendukung GLSL
• Bekerja di canvas
• Integrasi dengan antarmuka DOM

KEUNTUNGAN WEBGL

Berikut adalah keuntungan menggunakan WebGL:

• Meningkatkan dukungan dengan browser seluler − WebGL juga mendukung browser Mobile seperti
safari iOS, Browser Android, dan Chrome untuk Android.

• Sumber terbuka − WebGL adalah sumber terbuka. Anda dapat mengakses kode sumber perpustakaan dan
memahami cara kerjanya dan bagaimana itu dikembangkan.

• Tidak perlu kompilasi − JavaScript adalah komponen setengah pemrograman dan setengah HTML. Untuk
menjalankan skrip ini, tidak perlu mengkompilasi file. Sebagai gantinya, Anda dapat langsung membuka
file menggunakan salah satu browser dan memeriksa hasilnya. Karena aplikasi WebGL dikembangkan
menggunakan JavaScript, tidak perlu mengkompilasi aplikasi WebGL juga.

• Manajemen memori otomatis − JavaScript mendukung manajemen memori otomatis. Tidak perlu alokasi
memori secara manual. WebGL mewarisi fitur JavaScript ini.

• Mudah diatur − Karena WebGL terintegrasi dalam HTML 5, tidak perlu pengaturan tambahan. Untuk
menulis aplikasi WebGL, yang Anda butuhkan hanyalah editor teks dan browser web.

CARA KERJA WEBGL

Berikut adalah cara kerja WebGL:

• Inisialisasi: WebGL diinisialisasi di dalam elemen HTML canvas menggunakan kode JavaScript. Konteks
WebGL disediakan oleh browser untuk mengakses fungsi dan metode yang diperlukan.

• Pembuatan Shader: WebGL menggunakan bahasa pemrograman shader GLSL (OpenGL Shading
Language). Shader terdiri dari vertex shader dan fragment shader, yang dijalankan di GPU. Vertex shader
 mengatur posisi dan transformasi objek, sedangkan fragment shader mengatur warna dan pencahayaan
objek.

• Penyiapan Data: Data geometri seperti koordinat vertex, tekstur, dan indeks poligon perlu disiapkan dalam
bentuk buffer yang efisien untuk dikirim ke GPU. Buffer ini digunakan untuk menyimpan dan mengirim
data ke GPU.

• Mengirim Data ke GPU: Setelah data geometri disiapkan, WebGL mengirimnya ke GPU melalui buffer
vertex. Data ini kemudian digunakan oleh vertex shader untuk melakukan transformasi dan memproses
setiap vertex secara terpisah.

• Proses Rendering: Setelah data dikirim ke GPU, WebGL memulai proses rendering. Vertex shader
menghitung posisi akhir setiap vertex dan menerapkan transformasi lainnya. Fragment shader menghitung
warna setiap piksel berdasarkan cahaya, tekstur, dan efek lainnya.

• Interaksi dan Animasi: WebGL memungkinkan interaksi pengguna dan animasi melalui JavaScript. Anda
dapat memanipulasi parameter shader, mengubah objek 3D, dan memberikan respons terhadap input
pengguna.

WEBRTC
SEJARAH WEBRTC

Salah satu tantangan besar terakhir bagi web adalah untuk memungkinkan komunikasi manusia melalui suara
dan video: Komunikasi Real Time, RTC untuk jangka pendek. RTC harus sama alami dalam aplikasi web saat
memasukkan teks dalam input teks. Tanpa itu, kita terbatas pada kemampuan kita untuk berinovasi dan
mengembangkan cara baru bagi orang untuk berinteraksi.

Secara historis, RTC telah korporat dan kompleks, membutuhkan teknologi audio dan video yang mahal untuk
dilisensikan atau dikembangkan di rumah. Mengintegrasikan teknologi RTC dengan konten, data dan layanan
yang ada selama ini sulit dan memakan waktu, terutama di web.

Video chat Gmail mulai populer di tahun 2008, dan pada tahun 2011 Google memperkenalkan Hangouts, yang
menggunakan layanan Google Talk (seperti halnya Gmail). Google membeli GIPS, sebuah perusahaan yang
telah mengembangkan banyak komponen yang dibutuhkan untuk RTC, seperti teknik pembatalan codec dan
echo cancellation. Google membuka sumber teknologi yang dikembangkan oleh GIPS dan terlibat dengan
badan standar yang relevan di IETF dan W3C untuk memastikan konsensus industri. Pada bulan Mei 2011,
Ericsson membangun implementasi pertama WebRTC.

APA ITU WEBRTC

WebRTC (RTC mengacu pada Real-Time Communications) adalah sebuah teknologi yang memungkinkan
pengiriman audio atau video serta berbagi data antar peramban web (peer). Sebagai sebuah standar, teknologi
ini menghadirkan fitur pada peramban web untuk berbagi data dan melakukan telekonferensi secara peer-to-
peer, tanpa perlu memasang plugins atau aplikasi pihak ketiga.

Komponen WebRTC dapat diakses melalui JavaScript API, di antaranya: Nework Stream API, yang
merepresentasikan audio atau video dalam bentuk data stream; PeerConnection API, yang memungkinkan dua
atau lebih pengguna untuk berkomunikasi langsung melalui peramban web; dan DataChannel API, yang
memungkinkan bentuk komunikasi lainnya secara real-time untuk gaming, text chat, file transfer, dan lainnya.

KEGUNAAN WEB RTC

Saat ini WebRTC didukung di Chrome, Firefox, dan Opera di semua sistem operasi desktop dan sebagian
besar perangkat Android, artinya Anda dapat menelepon atau mengirim file menggunakan layanan berbasis
WebRTC apa pun dari komputer, laptop, tablet android Anda atau telepon tanpa mengunduh program
tambahan apa pun. Jika Anda menggunakan browser yang belum memiliki kemampuan WebRTC bawaan,
seperti Safari atau Internet Explorer, tersedia plugin yang mengaktifkan WebRTC untuk Anda.

Lintas platform - Karena WebRTC berbasis HTML-5, WebRTC dapat berjalan di hampir semua browser, di
hampir semua platform, tanpa kesulitan - selama tim di balik browser dan OS Anda ada di dalamnya. Karena
WebRTC masih cukup baru, tidak semua browser mendukungnya dan belum tersedia di iOS - tetapi kami
berani bertaruh bahwa itu tidak akan lama lagi.

Koneksi yang lebih baik -- Koneksi browser-ke-browser langsung jauh lebih kuat daripada koneksi VoIP
tradisional, yang berarti konferensi audio dan video berkualitas HD, transfer file lebih cepat, dan lebih sedikit
panggilan terputus.

CARA KERJA WEBRTC

Beberapa tahun yang lalu apabila ingin membuat sesuatu yang dapat melakukan panggilan suara atau video,
kita wajib menggunakan C/C++. Penggunaan bahasa ini mengakibatkan proses pengembangan yang panjang
serta biaya pengembangan yang lebih tinggi. WebRTC mengubah hal tersebut. Ia mengganti kebutuhan akan
C/C++ dengan Javascript API.

WebRTC menyediakan Javascript API yang dapat kita gunakan di dalam browser. Hal ini membuat kita
menjadi lebih mudah untuk mengembangkan produk yang mengintegrasikan komunikasi real time.
Sebetulnya, inti dari WebRTC dikembangkan sebagian besar menggunakan C/C++, namun developer yang
hanya perlu menggunakan WebRTC tidak perlu menyelami lapisan terdalamnya, cukup menggunakan API
Javascript.
REFERENSI

https://id.wikipedia.org/wiki/WebGL

https://www.bonsernews.com/lifestyle/4798166460/apa-kegunaan-webgl-dan-bagaimana-cara-
mengaktifkan-pada-google-chrome-berikut-pengertiannya

https://codepolitan.com/blog/mengenal-webgl

https://www.crudpro.com/2022/03/pembahasan-singkat-webgl.html

https://www.tutorialspoint.com/webgl/webgl_introduction.html

https://webglfundamentals.org/webgl/lessons/webgl-fundamentals.html#section-WebGL-Initialization

https://webglfundamentals.org/webgl/lessons/webgl-shaders.html

https://webglfundamentals.org/webgl/lessons/webgl-buffers.html

https://webglfundamentals.org/webgl/lessons/webgl-vertex-arrays.html

https://webglfundamentals.org/webgl/lessons/webgl-rendering-to-the-screen.html

https://webglfundamentals.org/webgl/lessons/webgl-interaction.html

https://www.kursuswebsite.org/penjelasan-dan-sejarah-tentang-webrtc/

https://solusipbx.com/knowledge-base/webrtc-adalah/

https://www.freeconference.com/id/blog/the-basics-what-you-need-to-know-about-webrtc/

https://codepolitan.com/blog/mengenal-webrtc-59c0cf77151c3