Pengarang Ant Design mengumumkan kisah di sebalik kemas kini versi!

Ant Design ialah bahasa reka bentuk UI peringkat perusahaan dan pustaka komponen React yang dilancarkan oleh Ant Financial Ia telah mendapat perhatian dan penggunaan meluas sejak pelancarannya pada tahun 2015, dan kini mempunyai lebih daripada 57,000 bintang di GitHub. Baru-baru ini, Ant Design mengeluarkan versi 4.0, yang membawakan beberapa kemas kini utama. Kami menemu bual Jiang Jilin, salah seorang pengarang teras pasukan Ant Design, dan bercakap tentang beberapa cerita di sebalik kemas kini versi 4.0.

Ant Design 4.0 dikeluarkan. Apakah kemas kini utama yang dibawakannya kali ini?

Terdapat beberapa kemas kini besar yang dikeluarkan kali ini. Contohnya, kami menambahkan tema gelap, komponen tanpa sempadan, sokongan pengantarabangsaan RTL dan komponen semula seperti Jadual, Borang, Pilih, dsb. untuk meningkatkan prestasi dengan ketara. Memandangkan terdapat banyak kandungan, elakkan daripada mengubahnya menjadi dokumen yang diterbitkan secara langsung. Selamat datang ke Yuque untuk melihat kemas kini lengkap: "Versi rasmi Ant Design ada di sini!" 》

Selepas bertahun-tahun pembangunan, Reka Bentuk Semut telah menjadi ekosistem. Sila perkenalkan ahli penting ekosistem ini.

Reka Bentuk Semut (selepas ini dirujuk sebagai antd) sebagai sistem reka bentuk merangkumi lebih daripada sekadar perpustakaan komponen. Selain Ant Design React yang biasa, terdapat juga versi Angular NG-ZORRO, Ant Desin Mobile, Ant Design Landing, HiTu React dan Ant Design Vue daripada sukarelawan komuniti. Penyelesaian bahagian hadapan/reka bentuk pertengahan yang luar biasa secara menegak Ant Design Pro dan pasaran blok yang sepadan, serta perpustakaan komponen terbitan Pro Layout dan Pro Table. Reka bentuk ini juga menyediakan banyak dokumen spesifikasi dan aset reka bentuk yang berkaitan.

Rekaan Semut adalah seperti pokok, dan ia sangat imaginatif untuk menyebarkan dahan dan daun di atasnya. Pada masa hadapan, kami mula-mula akan terus menjalankan penyelidikan mendalam berdasarkan sistem reka bentuk, dan kedua, kami akan membuat kemajuan bersama dengan rangka kerja yang berkaitan. Pada masa yang sama, Ant Design juga akan memperkayakan produk ekologi berdasarkan keperluan perniagaan sebenar.

Dalam proses dari 3.0 hingga 4.0, apakah masalah terbesar yang telah diatasi oleh pasukan antd? Apakah ciri baharu yang paling anda banggakan?

Versi v4 dan rakan sekelas komuniti telah membina semula sejumlah besar komponen asas, sekali gus meningkatkan prestasi pemaparan komponen. Sebagai contoh, kemas kini medan komponen Borang dalam versi v3 akan menyebabkan keseluruhan Borang dipaparkan semula, yang akan menyebabkan masalah prestasi yang serius dalam bentuk yang besar. Dalam v4, Borang hanya akan mengemas kini komponen medan yang berkaitan, sekali gus mengurangkan masa pemaparan. Penatalan maya terbina dalam komponen seperti Tree, Select dan TreeSelect, dengan itu mengurangkan dengan ketara elemen yang diberikan sebenar.

Bercakap tentang bahagian yang lebih sukar, pembinaan semula ini memerlukan penyelesaian pengecutan dan regangan berasaskan tatal maya kerana ia menyokong tatal maya. Contohnya, dalam versi v3 komponen Pokok, penskalaan boleh dicapai melalui peralihan dan ketinggian asli untuk mencapai kesan pengecutan dan regangan. Walau bagaimanapun, dalam penatalan maya, setiap elemen sebenarnya adalah elemen bebas, jadi jika anda ingin mencapai kesan animasi yang sama seperti v3 semasa menskala, anda perlu melaksanakan sendiri algoritma yang berkaitan. Oleh itu, kami membahagikannya kepada beberapa peringkat dan memproses logik yang berbeza dalam peringkat yang berbeza untuk menggabungkan pelaksanaan animasi yang menyokong penatalan maya. Logik pelaksanaan khusus agak rumit Jika anda berminat, anda boleh melihat kod rc-virtual-list yang berkaitan.

Bagaimana antd menimbang kecekapan, prestasi/pengalaman dan kualiti dalam reka bentuk?

Dari perspektif peribadi, tiga yang terakhir sebenarnya tidak bercanggah. Pembangunan komponen Ant Design secara amnya mempunyai langkah berikut:

• Pereka bentuk draf visual dan interaktif

• Jurutera membangunkan;

Semakan Kod & Semakan Pereka.
Setiap langkah dalam proses akan diselesaikan dengan serius dan bertanggungjawab, dan bahagian Semakan Kod juga merupakan peringkat yang paling lama. Proses Semakan Kod akan menyemak semula API dan pelaksanaan kod, dan pereka bentuk serta pembangun akan mengambil bahagian bersama untuk mencapai kesan 1 1 > Pembangunan komponen tidak boleh membuta tuli mengejar kecekapan Ia perlu digilap perlahan-lahan dari reka bentuk kepada pelaksanaan. Sebagai contoh, komponen Typography kelihatan sangat mudah sebagai komponen penyusunan huruf, tetapi ia mengambil masa sebulan dari reka bentuk kepada pembangunan API telah berulang kali dilaraskan untuk memudahkan kos memori pembangun dengan cara yang paling diperkemas diambil kira. Aspek reka bentuk juga berulang kali dipertimbangkan untuk mencapai kesan visual yang baik dalam konteks Cina dan Inggeris.

Dalam versi v3, masalah prestasi komponen terutamanya disebabkan oleh keperluan keserasian untuk versi IE yang lebih lama Oleh itu, banyak pelaksanaan hanya boleh menggunakan kaedah yang agak godam Isu berikut akan disebut menyebut mereka lagi. Memandangkan versi minimum IE v4 yang serasi telah ditukar kepada IE 11, ini bukan sekatan lagi, memberikan kami keupayaan untuk mengemas kini secara beransur-ansur untuk meningkatkan prestasi dengan lebih baik.

Kami telah membuat beberapa pertukaran dari segi keserasian dengan IE. Apakah kesukaran untuk serasi dengan IE?

Untuk serasi dengan versi IE yang lebih lama, versi v3 terpaksa membuat beberapa kompromi. Sebagai contoh, jika susun atur fleksibel tidak boleh digunakan, kami menggunakan apungan dan jadual tidak boleh digunakan, dan Jadual perlu menghasilkan Jadual tambahan untuk mencapai kesan lajur tetap. Dalam beberapa tahun kebelakangan ini, dengan peningkatan sistem Windows, bahagian versi lama IE telah menjadi lebih kecil dan lebih kecil. Ini juga merupakan peluang untuk kami meninggalkan versi IE yang sudah lapuk dalam versi v4 dan mengembara dengan ringan.

Kesukaran untuk serasi dengan IE ialah banyak tingkah laku yang tidak dijangka Selalunya tiada masalah dengan kod, tetapi pemaparan halaman tidak normal. Untuk keadaan ini, banyak teknologi hitam perlu dilakukan. Contohnya, memaksa komponen untuk menyegarkan semula, menggunakan penggodaman css IE sahaja, dsb. Di samping itu, banyak ciri HTML baharu yang dinyatakan sebelum ini tidak boleh digunakan dalam persekitaran IE, dan hanya boleh disimulasikan sendiri, mengakibatkan kehilangan prestasi yang serius.

Adakah anda fikir sokongan semasa antd untuk TypeScript sudah tersedia? Jika masih terdapat kekurangan, di manakah ia terletak terutamanya dan bagaimana ia akan diselesaikan?

Dalam versi v3, sebilangan besar komponen asas kami ditulis dalam js, jadi takrifan jenis ts juga dilakukan pada antd Kelemahannya ialah ia tidak sepadan sepenuhnya dengan komponen asas . Dalam versi v4, kami turut menukar sejumlah besar komponen asas kepada versi ts, dan menggunakan takrifan ini secara langsung pada sisi antd, dengan itu mengelakkan ketidakpadanan takrifan pada masa lalu. Sudah tentu, proses ini tidak berlaku dalam sekelip mata. Masih terdapat beberapa komponen asas yang masih belum ditukar.

Selain itu, kami juga menghadapi beberapa masalah yang menarik dan menjengkelkan - iaitu, disebabkan peningkatan skrip taip dan @types/react ontologi, takrifan ts asal menjadi tidak sah. Ada masanya Butang antd mengemas kini definisi tsnya setiap minggu untuk menyesuaikan diri dengan @types/react terkini. Keadaan ini tidak dapat dielakkan, teruskan kemas kini.

Dalam pengumuman keluaran, sumbangan dua pelajar komuniti @saeedrahimi @shaodahong telah disebut secara khusus. Bolehkah anda menceritakan kisahnya secara terperinci?

@saeedrahimi menyumbangkan keupayaan pengantarabangsaan RTL semua komponen kepada v4 dan menukar beribu baris kod. Fungsi ini sangat berkuasa, dan ia boleh mempesonakan selepas hanya satu PR. Dengan cara ini, kami menyemak & mengemas kini berulang kali, dan akhirnya menyedarinya, yang tidak mudah di tengah-tengah.

@shaodahong sebenarnya adalah seorang sukarelawan yang bersemangat semasa v3. Beliau juga banyak membantu semasa pengeluaran v4, antaranya pembangunan pakej keserasian telah disiapkan terutamanya oleh beliau. Melalui pakej keserasian, pembangun boleh menaik taraf antd daripada v3 kepada v4 pada kos yang paling rendah.

Sudah tentu, selain dua pelajar ini, terdapat ramai sukarelawan yang terlibat dalam pembangunan v4. Saya ingin mengambil kesempatan ini untuk mengucapkan terima kasih kepada semua sukarelawan sekali lagi!

Sesetengah pengguna telah melaporkan bahawa maklum balas komuniti adalah sukar Kod sumber dilaksanakan menggunakan enkapsulasi rc-*, yang membuatkan pembangun teragak-agak untuk membantu membetulkan pepijat. Bagaimanakah pasukan antd melihat hubungan dan interaksi dengan pembangun komuniti?

Komponen rc direka bentuk untuk ringkas dan fleksibel, jadi ia tidak mempunyai pergantungan yang kuat pada gaya. Selain fungsi komponen, antd juga mempunyai sistem reka bentuk sendiri, jadi ia akan menjadi lebih berat pada Reka Bentuk UI. Pembahagian ini membolehkan pengguna merangkum secara langsung berdasarkan komponen rc jika mereka hanya ingin menggunakan fungsi komponen tetapi tidak memerlukan gayanya. Sebagai contoh, komponen asas Borang rc-field-form itu sendiri tidak mempunyai gaya sama sekali, manakala dalam antd ia merangkum Borang dan Borang.Item yang digayakan tanpa mendedahkan komponen Medan asas. Malah, sebelum v4 dikeluarkan, ramai pelajar komuniti telah merangkum komponen mereka sendiri berdasarkan rc-field-form. Kedua-duanya berbeza dari segi idea reka bentuk dan tidak akan digabungkan pada masa hadapan.

Dari perspektif penghantaran PR, sebenarnya tidak perlu terlalu banyak beban psikologi. Komponen melaksanakan tugas mereka sendiri, dan anda tidak akan dihalang dengan mempunyai perpustakaan komponen rc tambahan di bahagian bawah. Malah, jika dilihat dari penyelenggaraan harian, sukarelawan mempunyai semangat yang sama untuk menghantar PR ke antd dan rc. Tidak ada pepijat yang tidak boleh diperbaiki dalam komponen rc. Malah kadangkala, sebaliknya, sesetengah pengguna hanya menggunakan komponen rc, jadi mereka menghantar banyak PR kepada komponen rc untuk membantu memperbaikinya, yang juga menyebabkan PR ini disuap kembali ke antd.

Apakah rancangan versi seterusnya? Apakah ciri baharu yang patut ditunggu-tunggu pada masa hadapan?

Selepas versi v4 dikeluarkan, disebabkan pembinaan semula sejumlah besar komponen, tumpuan utama akan diberikan pada pembetulan pepijat buat masa ini. Setelah ia stabil, kami akan bersedia untuk mod Serentak masa hadapan React. Di samping itu, terdapat juga rancangan untuk menjalankan penyelidikan mengenai css dalam js untuk menyokong keupayaan menukar tema secara dinamik. Sudah tentu, seperti yang saya katakan tadi, keutamaan semasa masih tertumpu pada pembetulan pepijat.

Sebagai projek sumber terbuka bintang hadapan yang digunakan secara meluas, pada pendapat anda apakah sebab kejayaan antd setakat ini? Apakah keuntungan dan pengajaran terbesar yang dipelajari daripada sumber terbuka dalam beberapa tahun kebelakangan ini?

Kepopularan Ant Design tidak dapat dipisahkan daripada sokongan pelajar dalam komuniti Ia adalah pengiktirafan semua orang yang menjadikan Ant Design seperti sekarang. Kelangsungan projek sumber terbuka memerlukan kuasa komuniti di samping mengekalkan kemas kini oleh penyelenggara. Dalam dunia sumber terbuka, anda akan melihat banyak projek yang sangat baik. Tetapi seiring dengan berlalunya masa, ia secara beransur-ansur tidak lagi dikekalkan. Oleh itu, bagaimana untuk mengekalkan daya hidup projek adalah keutamaan.

Reka Bentuk Semut telah berjalan jauh sejak ia menulis baris pertama kod pada tahun 2015. Keuntungan terbesar ialah bantuan daripada rakan sekelas dalam komuniti, yang berkumpul untuk membina Reka Bentuk Semut menjadi perpustakaan komponen kelas hadapan kelas pertama. Pada masa yang sama, sebagai projek sumber terbuka, ia juga mesti diselenggara secara terbuka dan telus dalam cara sumber terbuka. Supaya dapat memenuhi amanah rakan sekelas dalam masyarakat.

Atas ialah kandungan terperinci Pengarang Ant Design mengumumkan kisah di sebalik kemas kini versi!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!