Ini adalah newsletter pertama dari WWWID untuk secara rutin memberikan update terkini untuk para web developer agar tahu perkembangan dan tren pengembangan web seperti teknik, tools, libraries, dan frameworks. Berikut adalah apa yang web developer harus tahu edisi pertama.

Berita Terbaru

Firefox Developers 58 Release Notes

image

Firefox DevTool Terbaru

Rilis terbaru Firefox Developers yang berbasis Quantum Engine ini datang dengan beragam tool terbaru untuk web developers seperti devtool terbaru, dukungan font display di CSS, serta dukungan WebVR secara default.

Safari Technology Preview Release 44**
**Dukungan Payment Request API muncul di release terbaru Safari ini. Walaupun belum maksimal tapi dukungan ini menjadi berita baik bagi web developer terutama yang membuat aplikasi e-commerce.

Web Share Target API Supported in Chrome**
**Salah satu yang masih dirasakan miss di PWA adalah kemampuan untuk menerima intent share dari aplikasi lain. Misalnya Twitter Lite saat ini belum bisa melakukan tweet dengan konten yang kalian ingin share dari Chrome. Tapi dengan Web Share Target API ini, PWA akan bisa muncul di daftar pilihan aplikasi yang ingin kita gunakan untuk share konten.

Artikel Menarik

The Cost Of Javascript

image

Best practices untuk optimasi Javascript

Gambar terkadang diasumsikan menjadi sumber utama yang membuat loading terasa lambat, padahal file gambar tidak memperlambat rendering di browsers. Justru file Javascript yang sebenarnya terkadang menjadi pokok masalah sebenarnya.

Best Request is No Request, Revisited**
**Salah satu golden rule performance di web adalah bagaimana melakukan minimalisasi request sesedikit mungkin. Karena roundtrips yang diperlukan untuk melakukan requests berdampak pada waktu loading suatu halaman web. Tapi dengan makin tingginya adopsi HTTP2 apakah golden rule tersebut masih berlaku?

Images Filters Using WebGL**
**Web bukan cuma sekedar untuk menampilkan konten, tapi bisa menjadi aplikasi foto editor tanpa perlu di-install. Video ini menunjukkan bagaimana menggunakan WebGL untuk melakukan filtering pada file gambar layaknya aplikasi Instagram.

Learn CSS Grid In 5 Minutes**
**Membuat layout tampilan di halaman web merupakan sesuatu yang pasti dilakukan oleh web developer. Beberapa teknik layout dengan CSS frameworks yang ada perlahan tergantikan dengan feature native di CSS sehingga kebutuhan akan framework bisa dikurangi. Salah satu fitur native terbaru tersebut ada CSS Grid yang memungkinkan kita membuat layout grid dengan lebih mudah.

Take Control Your Scroll**
**Pada saat menggunakan aplikasi PWA terkadang pada saat kita berlebihan scroll ke bawah secara default aplikasi akan melakukan refresh halaman karena itu adalah default behaviour dari browsers. Untuk mencegahnya kalian bisa menggunakan CSS overscroll-behavior.

A Pinterest PWA Performance Case Study**
**Pinterest baru meluncurkan mobile web terbaru mereka yang fokus untuk performance di mobile. Aplikasi PWA ini dikembangkan dengan React dan fokus pada critical rendering path untuk memastikan loading dan interaktif bisa kurang dalam 5 detik.

Tools, Library, dan Framework

Bankai, The Friendly Web Compiler

image

Bankai web server

Bukan jamannya lagi menginstall MAMP, atau WAMP sebagai web server di komputer yang digunakan untuk development. Tapi tool seperti Bankai ini memudahkan kita untuk development dengan HTTP2 server dengan live reloading. Serta membantu kita untuk melakukan build untuk production dengan fitur optimasi seperti minify, tree shaking, flatten, dan lainnya.

Critical 1.0 **
**Critical CSS adalah style yang diperlukan untuk menampilkan tampilan yang akan terlihat pertama kali pada saat diakses. Dengan tool critical terbaru ini kita bisa melakukan ekstraksi critical CSS tersebut dengan meng-embed-nya secara inline di file HTML kita.