[Kompilasi dan Perkongsian] 15 projek sumber terbuka bahagian hadapan teratas Alibaba, lihat yang mana yang telah anda gunakan!

Artikel ini akan melihat projek sumber terbuka bahagian hadapan popular Alibaba yang mana yang telah anda gunakan? Jika anda belum pernah menggunakannya, anda boleh mencubanya!

Ikhtisar teks penuh:

• Reka Bentuk Semut: UI peringkat perusahaan bahasa reka bentuk Dan Pustaka komponen React

• UI Elemen: Pustaka komponen desktop berdasarkan Vue 2.0

• Telur .js: Rangka kerja Node.js peringkat perusahaan

• Icejs: Penyelesaian aplikasi pertengahan dan belakang berasaskan tindak balas

• UmiJS: Rangka kerja aplikasi React peringkat perusahaan boleh pasang

• G2: Sintaks grafik visual yang sangat interaktif dipacu data

• hooks: Pustaka React Hooks berkualiti tinggi dan boleh dipercayai

• Formily: Penyelesaian borang MVVM

• Rax: Enjin pemaparan silang kontena

• Enjin Kod Rendah: Enjin kod rendah

• Pertengahan: Rangka kerja Node.js bersepadu awan berorientasikan masa depan

• BizCharts: Carta universal perpustakaan komponen

• Hilo: Enjin permainan interaktif HTML5

• XRender: bentuk tengah dan belakang , jadual, penyelesaian carta Penyelesaian

• Reka Bentuk Fusion: Penyelesaian UI pertengahan dan belakang peringkat perusahaan

1. Ant Design

Ant Design ialah bahasa reka bentuk UI peringkat perusahaan dan pustaka komponen React. Ia mempunyai ciri-ciri berikut:

• Bahasa interaktif dan gaya visual yang diekstrak daripada produk pertengahan dan belakang peringkat perusahaan.
• Komponen React berkualiti tinggi di luar kotak.
• Dibangunkan menggunakan TypeScript, menyediakan fail definisi jenis lengkap.
• Pembangunan pautan penuh dan sistem alat reka bentuk.
• Berpuluh-puluh bahasa antarabangsa disokong.
• Kedalaman ke dalam setiap perincian keupayaan penyesuaian tema.

• Github Reka Bentuk Semut (⭐️ 81.5k): github.com/ant-design/…
• Ant Design Pro Github (⭐️ 32.7k): github.com/ant-design/…
• Ant Design Mobile Github (⭐️ 10.5k): github.com/ant-design/…

2 UI Elemen

Elemen ialah set alatan untuk pembangunan Pustaka komponen desktop berdasarkan Vue 2.0 yang disediakan oleh pembangun, pereka bentuk dan pengurus produk.

Github (⭐️ 52.5k): github.com/ElemeFE/ele…

3. Egg.js

Egg.js ialah rangka kerja Node.js peringkat perusahaan Mekanisme pemalam Egg sangat berskala Pemalam hanya melakukan satu perkara. Egg mengagregatkan pemalam ini melalui rangka kerja dan menyesuaikan konfigurasi mengikut senario perniagaannya sendiri, supaya kos pembangunan aplikasi menjadi sangat rendah. Ia mempunyai ciri-ciri berikut:

• Membekalkan keupayaan untuk menyesuaikan rangka kerja lapisan atas berdasarkan Telur
• Mekanisme pemalam berskala tinggi
• Multi terbina dalam -pengurusan proses
• Dibangunkan berdasarkan Koa, prestasi cemerlang
• Rangka kerja yang stabil, liputan ujian tinggi
• Pembangunan progresif

Github (⭐️ 18.1k): github.com/eggjs/egg

4 Icejs

Flying Ice ialah React penyelesaian R&D berasaskan yang berkisar pada aplikasi Rangka kerja R&D icejs menyediakan keupayaan asas seperti pembinaan asas, penghalaan dan penyahpepijatan, serta keupayaan dalam bidang seperti bahagian hadapan mikro dan penyepaduan Ia juga merendahkan ambang R&D dengan menggabungkan visual operasi, penggunaan semula bahan dan penyelesaian lain. Ia mempunyai ciri-ciri berikut:

• Menyokong kedua-dua mod Vite & Webpack, perniagaan boleh memilih mengikut keperluan
• Keupayaan kejuruteraan di luar kotak: TypeScript/Webpack5/Vite/Style Scheme/Mock/...
• Amalan terbaik yang sesuai dengan perniagaan: spesifikasi direktori, spesifikasi kod, skema penghalaan, pengurusan status, permintaan data, dll.
• Mod aplikasi berbilang: menyokong SPA, MPA dan juga menyokong pemaparan sebelah pelayan SSR dan pembinaan statik SSG
• Keupayaan pemalam yang berkuasa: Semua keupayaan rasmi direalisasikan melalui pemalam, dan perniagaan boleh mengembangkan pelbagai keupayaan melalui pemalam
• Penyelesaian domain yang kaya: micro front- end solution icestark, penyelesaian bersepadu, React Hooks solution ahoks, form solution Formily, dsb.

Github (⭐️ 17.3k): github.com/alibaba/ice

5. UmiJS

umi ialah rangka kerja aplikasi tindak balas peringkat perusahaan yang boleh dipasang. Umi adalah berdasarkan penghalaan dan menyokong penghalaan terkonfigurasi dan penghalaan konvensional untuk memastikan fungsi penghalaan lengkap dan mengembangkan fungsi dengan sewajarnya. Kemudian ia dilengkapi dengan sistem pemalam dengan kitaran hayat yang lengkap, meliputi setiap kitaran hayat daripada kod sumber kepada produk terbina, menyokong pelbagai pengembangan fungsian dan keperluan perniagaan. Ia mempunyai banyak ciri yang sangat menarik, seperti:

• Peringkat perusahaan, lebih banyak pertimbangan akan diberikan kepada keselamatan, kestabilan, amalan terbaik dan keupayaan kekangan
• plug-in, Semuanya boleh diubah, Umi sendiri juga terdiri daripada plug-in
• MFSU, penyelesaian pembungkusan Webpack yang lebih pantas daripada Vite
• Hautan lengkap berdasarkan React Router 6
• Paling pantas secara lalai Minta
• SSR & SSG
• ESLint dengan prestasi kotak putih yang stabil dan Jest
• akses peringkat rangka kerja ke React 18
• Amalan terbaik Monorepo

Github (⭐️ 12.9k): github.com/umijs/umi

6. G2

G2 ialah satu set sintaks grafik visual yang dipacu data, sangat interaktif untuk carta statistik konvensional, dengan kemudahan penggunaan dan kebolehskalaan yang tinggi. Menggunakan G2, anda tidak perlu memberi perhatian kepada pelbagai butiran pelaksanaan carta yang membosankan Anda boleh menggunakan Kanvas atau SVG untuk membina pelbagai carta statistik interaktif dengan satu pernyataan.

Github (⭐️ 11.3k): github.com/antvis/g2

7. ahooks

ahooks ialah satu set perpustakaan React Hooks yang berkualiti tinggi dan boleh dipercayai Dalam proses pembangunan semasa projek React, satu set perpustakaan React Hooks yang mudah digunakan amat diperlukan . Ia mempunyai ciri-ciri berikut:

• Mudah dipelajari dan digunakan
• Sokongan SSR
• Pemprosesan khas fungsi input dan output, dan mengelakkan masalah penutupan
• Mengandungi sejumlah besar Cangkuk lanjutan yang diekstrak daripada perniagaan
• Mengandungi banyak Cangkuk asas
• Dibina menggunakan TypeScript, menyediakan fail definisi jenis lengkap

Github (⭐️ 10.1k): github.com/alibaba/hoo…

8. Formily

Formily ialah penyelesaian borang MVVM abstraksi berdasarkan model domain borang. Dalam React, keseluruhan isu pemaparan pokok untuk borang sangat ketara dalam mod terkawal. Khususnya untuk senario pautan data, mudah untuk menyebabkan halaman terhenti Untuk menyelesaikan masalah ini, Formily melaksanakan pengurusan status bagi setiap medan borang, dengan itu meningkatkan prestasi operasi borang. Pada masa yang sama, ia menyepadukan protokol Skema JSON secara mendalam, yang boleh membantu anda menyelesaikan dengan cepat masalah pemaparan borang dipacu belakang. Ia mempunyai ciri-ciri berikut:

• Prestasi tinggi
• Sedia untuk digunakan di luar kotak
• Logik terpaut untuk mencapai kecekapan tinggi
• Cross- keupayaan tamat, logik boleh merentas rangka kerja , penggunaan semula rentas terminal
• Keupayaan pemaparan dinamik

Github (⭐️ 8.3k): github.com/alibaba/for…

9 Rax

Rax ialah penyelesaian silang yang paling banyak digunakan oleh Alibaba, menyokong pembangun untuk menulis Web, program kecil. , Aplikasi silang hujung dalam bekas yang berbeza seperti Flutter. Ia mempunyai ciri-ciri berikut:

• Tahap sintaks Rax adalah berdasarkan React dan anda boleh menggunakan Hooks, Context dan API React lain dengan lebih daripada 80% sokongan
• Rangka kerja R&D sokongan rasmi Rax App menyokong TypeScript, Less /Sass dan asas lain Keupayaan Kejuruteraan, menyokong pelbagai keupayaan MPA, SPA dan SSR pada masa yang sama
• Menyokong pembangunan program kecil merentas vendor berbeza seperti Alipay/WeChat/Byte melalui sintaks Rax yang lengkap, dan boleh diturunkan taraf kepada Web
• Sokong aplikasi silang merentas berbilang bekas berdasarkan piawaian Web, termasuk aplikasi Web, aplikasi Flutter (Kraken) dan aplikasi Weex
• Ekosistem silang yang kaya, seperti komponen silang Fusion Mudah Alih, API Uni API silang

Github (⭐️ 7.8k): github.com /alibaba/rax

10 . LowCodeEngine

Enjin kod rendah LowCodeEngine ialah rangka kerja R&D kod rendah dengan skalabiliti berkuasa yang disediakan untuk pembangun platform kod rendah. Ia dihasilkan bersama oleh Alibaba Front-end Committee dan DingTalk. Pengguna boleh dengan cepat menyesuaikan platform kod rendah yang memenuhi keperluan perniagaan mereka berdasarkan enjin kod rendah. Ia mempunyai ciri-ciri berikut:

• Enjin kernel berorientasikan sambungan yang diekstrak daripada platform kod rendah peringkat perusahaan, mematuhi konsep reka bentuk kernel terkecil dan ekologi terkuat
• Sedia untuk -gunakan di luar kotak Unsur ekologi berkualiti tinggi, termasuk sistem bahan, penetap, pemalam, dsb.
• Rantai alat lengkap yang menyokong kitaran R&D pautan penuh unsur ekologi seperti sistem bahan, penetap, pemalam, dsb.
• Keterluasan Berkuasa, telah menyokong hampir 100 pelbagai platform kod rendah menegak
• yang dibangunkan menggunakan TypeScript, menyediakan fail definisi jenis lengkap

Github (⭐️ 7.6k): github.com/alibaba/low…

11 🎜>Midway ialah alat yang sesuai untuk membina rangka kerja Node.js untuk aplikasi tradisional, perkhidmatan mikro dan bahagian belakang program mini. Ia boleh menggunakan Koa, Express atau Egg.js sebagai rangka kerja web asas. Ia juga menyediakan penyelesaian asas untuk kegunaan kendiri, seperti Socket.io, GRPC, Dubbo.js dan RabbitMQ, dsb. Selain itu, Midway juga merupakan rangka kerja tanpa pelayan Node.js untuk pembangun front-end/full-stack. Membina apl dekad yang akan datang. Boleh dijalankan pada AWS, Alibaba Cloud, Tencent Cloud dan VM/bekas tradisional. Mudah disepadukan dengan React dan Vue.

Github (⭐️ 5.9k):

github.com/midwayjs/mi…12. BizCharts

BizCharts ialah perpustakaan komponen carta umum Alibaba, khusus untuk mencipta penyelesaian visualisasi data yang cekap, profesional dan mudah untuk bahagian tengah dan belakang perusahaan Berdasarkan perpustakaan carta React yang dirangkumkan G2 dan G2Plot, ia telah mengalami senario perniagaan kompleks Alibaba untuk. masa yang lama Selepas tiga tahun pembaptisan, ia memenuhi keperluan pelaksanaan perniagaan carta konvensional dan carta yang sangat disesuaikan dari segi fleksibiliti, kemudahan penggunaan dan kekayaan.

Github (⭐️ 5.9k):

github.com/alibaba/Biz…13. Hilo

Hilo ialah penyelesaian permainan silang terminal HTML5 yang dibangunkan oleh Alibaba Group. Ia boleh membantu pembangun membuat permainan HTML5 dengan cepat. Ia mempunyai ciri berikut:

Hilo menyokong versi berpakej paradigma modul berbilang, termasuk AMD, CMD, COMMONJS dan Standalone. Selain itu, anda boleh menambah dan mengembangkan modul dan jenis mengikut keperluan; . Penyelesaian pemaparan berbilang (dipatenkan pada masa ini);

• Sokongan penyemak imbas lengkap dan penyelesaian berprestasi tinggi, penyelesaian pemaparan Flash yang unik, boleh berjalan "sejuk" walaupun dalam pelayar IE versi rendah "Permainan; penyelesaian pemaparan DOM boleh menyelesaikan masalah prestasi yang dihadapi oleh penyemak imbas mudah alih berprestasi rendah dengan ketara;
• Sokongan enjin fizik - Chipmunk, menyokong sokongan animasi fizik yang berkembang sendiri - DragonBones, dengan sistem Animasi tulang terbina dalam - Tahiti (sedang digunakan secara dalaman);
• Kaya dengan kes dan rangka kerja yang matang, ia telah diuji oleh berbilang Alibaba Double Eleven dan aktiviti pemasaran interaktif promosi pertengahan tahun
• Github (⭐️ 5.8k):

github.com/hiloteam/Hi…

14.

Github (⭐️ 4.9k):

github.com/alibaba/x-r…15. Reka Bentuk Fusion

Reka Bentuk Fusion ialah kaedah kerja yang direka untuk meningkatkan kecekapan pembinaan UI antara reka bentuk dan pembangunan. Dengan membina protokol standard dan aliran kerja antara reka bentuk dan bahagian hadapan berdasarkan model DPL, kami boleh membina DPL yang memenuhi keperluan perniagaan dengan cepat, meningkatkan kecekapan pembinaan dan kecekapan aplikasi DPL serta membantu perniagaan melaksanakan pembinaan UI dengan cepat.

Github (⭐️ 4.2k):

github.com/alibaba-fus…

Alamat asal: https://juejin.cn/post/7135382523672002590

(Mempelajari perkongsian video:

Bermula dengan bahagian hadapan web

)

Atas ialah kandungan terperinci [Kompilasi dan Perkongsian] 15 projek sumber terbuka bahagian hadapan teratas Alibaba, lihat yang mana yang telah anda gunakan!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!