Mari kita buat web menjadi luar biasa lagi

Web modern adalah sistem dinamis yang kompleks yang terus bergerak. Seperti disebutkan dalam banyak artikel, menjadi sangat sulit untuk melacak semua perubahan karena alat dan kerangka kerja baru muncul hampir setiap hari. Pengetahuan menjadi usang bahkan sebelum memiliki pijakan. Tentu saja, semua ini adalah hasil nyata dari perkembangan dan pertumbuhan yang cepat, tetapi ini pasti menambah kerumitan bagi pengembang web dan meningkatkan ambang batas untuk memasuki profesi.

Datang ke titik absurditas bahwa Anda harus mengkonfigurasi babel terlebih dahulu, kemudian webpack, dan kemudian berurusan dengan pengaturan khusus untuk kerangka kerja yang dipilih untuk membuat formulir entri data pengguna yang sederhana ... Dan ini mungkin terlalu banyak kata baru untuk pendatang baru ke tim yang dipercayakan dengan tugas yang tampak sederhana ini. . Tidak, kemungkinan besar proyek sudah dikonfigurasikan dan dikonfigurasikan, dan pemula tentu tidak akan dibiarkan sendirian untuk kemurahan nasib singkat mengatakan kepadanya untuk apa. Tetapi perlu diakui bahwa itu benar-benar menjadi terlalu rumit dan kami tampaknya menghabiskan sebagian besar waktu pada semua sistem pembangunan ini dan berjuang dengan konfigurasi.

Tapi mari kita coba untuk mengingat - apakah selalu seperti ini? Apakah pencipta web memimpikan masa depan yang demikian? Tidak, sial, dan sekali lagi tidak! Lagi pula, beberapa tidak ada yang, sering jelek, dipenuhi dengan trik dan trik, tetapi webnya berbeda - sederhana dan mudah dimengerti! Di sini kami telah menambahkan skrip, ini gaya, dan inilah tata letak halaman kami. Jadi apa yang salah, apakah semuanya menjadi sangat buruk? Bagaimanapun, javascript dan seluruh web hanya tumbuh dan berkembang, bahasa menjadi lebih kuat dan lebih ekspresif, modularitas muncul, keuntungan dari berbagai templat arsitektur menjadi jelas, dan - di mana kesederhanaan sebelumnya? Apakah kita benar-benar kehilangan dia selamanya?


(Spider-man yang luar biasa)

Jawabannya sebenarnya cukup sederhana dan langsung. Web telah benar-benar tumbuh dan menjadi lebih rumit, sekarang tidak jarang menemukan aplikasi multimedia yang sepenuhnya ditulis untuk teknologi web atau game 3D di browser, yang tidak terpikirkan 10 tahun yang lalu. Tetapi masalah utama adalah bahwa kita sering ingin dari web bahwa itu belum siap untuk memberi kita - teknologi dan standar terbaru, template arsitektur eksperimental, semuanya hanya yang terbaru dan paling modern dan tentu saja itu harus bekerja di mana saja dan untuk semua orang, dan tolong cepat . Dan kemudian geng liar yang dipimpin oleh webpack muncul di tempat kejadian dan mulai mengoreksi bola. Dan sekarang Anda sudah menutup telepon dengan konfigurasi yang rumit dan proyek Anda sekitar satu setengah menit dan beratnya lima puluh megabita. Finito la comedia. Perjuangan dengan konfigurasi dimulai dalam upaya untuk memeras kinerja lebih banyak dan mengurangi ukuran. Dan kemudian pengembangan dan implementasi ide-ide seperti apa yang dapat didiskusikan kemudian, jika kita menghabiskan sebagian besar waktu pada pengaturan jalur perakitan. Akui siapa pakar tim Anda di webpack?



Kami tidak terbiasa dengan hal ini, tetapi telah mencapai kesepakatan bahwa ini normal, tetapi bagaimana lagi? Kami digantung dengan jenis dan kerangka kerja, korporatisme, keamanan - Anda bahkan tidak bisa bertengkar. Tetapi kemana perginya kemudahan dan kesederhanaan percobaan ini, yang untuknya bahasa dinamis yang diketik dengan lemah ini disusun? Dan semuanya, bukan miliknya, lenyap di bawah gunung kumpulan dan perusahaan. Tapi sungguh tidak ada yang bisa dilakukan?

Perlu berhenti dan berpikir, tetapi apa yang kita lakukan dan mengapa? Lagipula, jika kita menggunakan webpack, rollup, parcel (garis bawah seperlunya) dan buat semua bundel yang tidak dapat dibaca ini yang kemudian mustahil untuk di-debug bahkan dengan peta sumber, maka tentunya seseorang membutuhkan ini, kan? Ya, semuanya demikian, untuk produksi cepat dan efisien dari bundel yang tidak dapat Anda dapatkan di mana pun dan bahkan HTTP2 yang ketinggalan jaman tidak membuat tugas lebih mudah. Itulah sebabnya pengembang berkemas di kantor pada malam musim gugur yang panjang, tinggal lebih lama di tempat kerja dan membakar ratusan ribu kilowatt energi, berkemas di departemen, berkemas di perusahaan, berkemas di seluruh dunia mentransmisikan pergeseran dengan gerakan matahari. Itu terjadi begitu saja, dan itulah hukumnya. Dura lex, sed lex. Jadi pertanyaan Shakespeare yang sebenarnya adalah yang harus disalahkan atau tidak dapat disalahkan - itu mati sebelum bahkan sempat mematahkan bibir Hamlet muda yang membuka studio visual untuk menumpuk karya agung lainnya.


(Baiklah)

Tetapi tunggu, Anda mengatakan bahwa semua ini diperlukan untuk produksi, tetapi bagaimana dengan pengembangan? Mengapa tidak mungkin untuk mengembangkan dengan nyaman seperti di masa lalu yang baik, hanya dengan memulai server dan kemudian mengemas semuanya sebelum mengirimkannya ke produksi? Dan mengapa kita umumnya menggunakan alat yang sama untuk produksi dan pengembangan? Mengapa tidak menggunakan solusi yang dirancang khusus untuk pengembangan, karena apa yang kita lakukan entah bagaimana tidak terlalu logis.

Dan ini benar-benar tidak logis, dan kita lebih suka melakukannya tanpa adanya alternatif, atau hanya karena kita sudah terbiasa. Tetapi bagaimana jika saya mengatakan bahwa Anda punya pilihan?



Meet hq - server khusus untuk mengembangkan aplikasi web. hq adalah server statis pada steroid yang memahami segala sesuatu yang tidak bisa ditangani oleh server normal. Apakah Anda menginginkan fitur terbaru dari standar javascript, tetapi browser Anda belum mendukungnya? - kumohon! Perpustakaan Anda menggunakan format commonjs - tidak ada masalah! Turun dengan alat-alat lain yang diasah untuk bekerja dengan setiap kerangka kerja tertentu, hq mendukung semuanya, langsung dari kotak. hq begitu keren sehingga tidak memerlukan konfigurasi apa pun, itu hanya berfungsi dan melakukan tugasnya. Tidak ada parsel, semuanya berbeda dari milik Anda, hq SANGAT TIDAK memerlukan konfigurasi, tidak ada, jadi tidak ada tempat untuk pergi. Instal sekali saja

npm install -g @hqjs/hq

dan kemudian jalankan dengan satu perintah di root proyek untuk mulai bereksperimen segera

hq

Nah, Anda berkata, geng lama menawari kami tentang hal yang sama, ya, mungkin konfigurasi sedikit lebih, sedikit kurang sederhana, tetapi semuanya sangat mirip, jadi mengapa kita membutuhkan Chuck Norris baru ini di dunia perawan? Dan kemudian saya akan menjawab Anda dengan moto baru rumah Greyjoy - "Kami bukan bandit!". Ya, sebenarnya, kami bukan gangster!


(House Greyjoy. Kami Jangan Menabur Bundlem)

Hai, saya telah terlibat dalam pengembangan web sejak saya berusia 13 tahun dan saya mulai menggedor ketika saya berusia 19 tahun. Teman saya mengaitkan hal ini ketika saya pergi ke bengkelnya di mana dia menggedor siang dan malam untuk terbang. Saya bertanya apa yang kamu lakukan? Dan dia berkata bahwa ini adalah hal baru, sekarang sangat modis dan keren dan saya pasti harus mencobanya. Pada awalnya saya hanya menempelkan file, dan kemudian saya mencoba bundel kecil dengan kompiler penutupan dan kemudian saya tidak bisa berhenti. teguk, browserify, lalu webpack ... Bundel saya semakin sulit. Saya tidak tahu bagaimana harus berhenti, saya jatuh ke dalam siklus yang tidak memungkinkan saya untuk pergi. Setiap kali saya datang ke proyek baru, seseorang sudah menggedor sana dan itu tidak mungkin untuk menolak. Tidak ada bandit yang tidak prestisius! Orang-orang dari profesi dan bahkan teman dekat menolak untuk berkomunikasi dan tidak menelepon saya kembali ketika mereka mengetahui bahwa saya ingin berhenti. Jadi tidak ada tempat untuk pergi. Tapi sekarang aku bersih! Saya tidak lagi bandit selama pengembangan! Teman-teman dan kenalan saya berhenti membenturkan dengan saya, sekarang ini tidak diterima di perusahaan kami. Dan tahukah Anda? Saya tidak pernah merasa begitu baik! Dunia akhirnya mulai bermain dengan warna-warna baru dan waktu mulai untuk bekerja dan keluarga.

Serius, kurangnya ikatan sangat menyederhanakan kehidupan. Ingatlah situasi yang tak tertahankan ketika tidak mungkin untuk menempatkan break point tidak hanya pada ekspresi, tetapi bahkan pada garis yang diinginkan! Atau nama-nama variabel ini yang dihasilkan oleh webpack __webpack __ @ #% ^ $ !!! Ketika Anda membacanya, tidaklah mengejutkan untuk memanggil Setan, tetapi Anda tidak ingin menulisnya ke konsol dan musuh, dan apa yang paling berlawanan mereka sembunyikan di balik nama manusia biasa, jadi coba tebak apa lagi. Secara umum, debugging sering berubah menjadi neraka, bahkan dengan peta sumber penuh. Berapa kali sehari Anda bersumpah kode di dalam node_modules? Berapa banyak kutukan yang jatuh di kepala pengembang React dan Angular yang malang karena tidak mungkin untuk memahami pesan kesalahan dan di mana kesalahan ini terjadi? Setelah kami beralih ke hq, kami melupakan semua ini sebagai mimpi buruk. Sebenarnya ada lebih banyak waktu, sekarang Anda tidak perlu bingung mengapa itu tidak akan atau hanya diam-diam tidak berfungsi dan di mana kami mendapatkan perpustakaan ini dengan sepuluh megabita dalam pembuatan, sekarang Anda dapat dengan jelas melihat di mana! Ada lebih sedikit penderitaan, pekerjaan menjadi lebih mudah, dan ternyata menjadikannya suatu kesenangan.


(Orang ini Varg atau kulit yang berubah, ia dapat menembus kesadaran hewan. Sekarang ia terbang dengan elang, mencari musuh)

Bagian yang terbaik adalah bahwa hq tidak tampak sesuatu yang baru dan kompleks, rasanya seperti dia selalu bersama kami, semuanya begitu sederhana dan akrab. hq adalah server statis yang hanya memahami Anda. Awal proyek baru menjadi sangat cepat, satu perintah di konsol dan Anda dapat mulai bereksperimen. Kerangka kerja, perpustakaan, format, pendekatan arsitektur - semua ini tidak lagi menciptakan hambatan, dengan segala sesuatu yang baru berfungsi seperti di masa lalu yang baik, dengan cepat, sederhana dan logis! Plus, proyek sumber terbuka yang hebat sehingga Anda selalu dapat meningkatkan sesuatu atau menambahkan dukungan untuk beberapa format baru.

Terus terang, kami menemukan kekurangan. Sebelumnya, ketika membangun dengan webpack memakan waktu beberapa menit, itu adalah alasan yang bagus untuk melihat ke dapur untuk secangkir kopi aromatik, tetapi sekarang semuanya bekerja sangat cepat sehingga tidak ada waktu untuk ini. Meskipun, apakah perlu mencari alasan untuk kopi yang enak?



Bagaimana cara kerjanya? Ini mungkin memberi kesan bahwa hq adalah monster besar dan kuat yang ditenun oleh Dr. Frankenstein dari berbagai bagian yang berbeda dan tidak koheren yang dibumbui dengan sedikit ilmu hitam. Namun pada kenyataannya, semuanya cukup harmonis dan seragam. Baru-baru ini mendistribusikan setiap file secara individual berdasarkan permintaan, seperti halnya server statis biasa. Ini hanya memberi kita kesempatan terbatas untuk menyingkirkan kode yang tidak digunakan, tanpa guncangan pohon penuh, tetapi ini menghemat banyak waktu yang dihabiskan untuk analisis dependensi. Semua transformasi terjadi secara instan dan langsung. Selain itu, hanya minimum yang diperlukan yang diubah. Jika Anda menggunakan peramban modern dan mematuhi standar web, maka kode Anda sepertinya tidak akan berubah sama sekali. Meskipun Anda dapat mengandalkan standar, tidak ada jaminan bahwa perpustakaan yang Anda gunakan akan melakukan hal yang sama. Sebagian besar dari mereka mungkin akan dikirim dalam format commonjs, yang tidak memungkinkan mereka untuk bekerja di browser apa adanya. Baru-baru ini mengurus hal ini dan mengubah modul commonjs ke format ESM, proses tidak standar, tetapi impor yang lebih umum (seperti css atau json) dan merusak objek yang diimpor ketika diperlukan. hq bekerja dengan browser web, menggunakan sistem caching untuk mempercepat pengiriman aset dan hanya mentransfer file yang telah diubah. Ini akan secara otomatis memuat ulang halaman ketika Anda mengubah kode Anda sehingga Anda dapat langsung mengevaluasi hasil dari perubahan tersebut. Hebat dapat bekerja dengan banyak kerangka kerja, tetapi tidak tergantung pada kode mereka. Sebaliknya, hq membuat serangkaian transformasi AST menggunakan plugin babel yang dibuat khusus untuk hq sehingga dapat memahami dan mengubah berbagai teknologi dan pendekatan yang digunakan dalam pengembangan ke standar tunggal yang didukung oleh browser.

Dengan demikian, terlepas dari semua kesulitan dan tantangan yang dihadirkan oleh web modern, pengembangan proyek dapat tetap sederhana dan intuitif, seperti yang terjadi pada awal teknologi web. Coba hq sekarang untuk meningkatkan pengalaman pengembangan Anda di proyek lama, atau gunakan itu untuk membuat proyek baru yang menarik!

npm install -g @hqjs/hq