شركة Mercari تحسِّن إنتاجية تطوير واجهة المستخدم بنسبة 56% باستخدام Jetpack Compose
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
تتيح منصة Mercari لملايين الأشخاص التسوّق وبيع أي منتج تقريبًا. تأسست الشركة في عام 2013 في اليابان، وأصبحت الآن أكبر سوق C2C في اليابان يرتكز على الهواتف الذكية. بدأ فريق مهندسي العملاء في شركة Mercari في استخدام Jetpack Compose في عام 2020 بهدف استخدام الحلول والتقنيات الحديثة التي يمكن توسيعها على المدى الطويل لإنشاء حزمة التكنولوجيا الخاصة بها للتطبيقات الجديدة.
الإجراءات التي اتخذتها الشركة
احتاج فريق Mercari إلى تنفيذ نظام تصميم مع إدارة وتصميم معقدين للحالة في طرق عرض Android - وهي مهمة معقدة للغاية. من خلال استخدام Jetpack Compose، لم يكُن قادرًا على تنفيذ هذا النظام المعقد فحسب، بل ساعده أيضًا في قضاء وقت أقل في تطوير كل شاشة.
وساعدت Jetpack Compose أيضًا الفريق في كتابة رمز واجهة المستخدم لتطبيقهم الجديد باستخدام نظام التصميم، ما يجعل رمز واجهة المستخدم موجزًا ويسهل فهمه. نتيجة لذلك، يمكن للفريق قضاء المزيد من الوقت في كتابة الشاشات ومنطق العمل، مثل الدعم العملي للمظهر الداكن.
بالإضافة إلى ذلك، كتب فريق Mercari أداة لإثبات المفهوم لدمج Figma مع نظام التصميم، والذي ينشئ تلقائيًا تعليمة برمجية لواجهة المستخدم من تصميمات المكونات. أوضح الفريق أنّ تطوير هذه الأداة كان أسهل باستخدام ميزة Compose بسبب طبيعتها التصريحية.
"بعد أن يعتاد مطوّرو تطبيقات Android على كتابة رموز Jetpack Compose، لن يرغبوا في العودة لاحقًا". - أنتوني ألان كوندا، مسؤول تكنولوجيا Android في شركة Mercari
النتائج
بين Jetpack Compose ونظام التصميم الجديد، تمكّنت شركة Mercari من استخدام رموز برمجية أقل بكثير لكتابة الشاشات. وبالنسبة إلى الشاشات ذات المحتوى القابل للتمرير اللانهائي، وهو أحد حالات الاستخدام الشائعة، نجحت الشركة في خفض الرموز البرمجية بنسبة %56 تقريبًا. ونتيجة لذلك، تمكنوا من كتابة المزيد من الشاشات في نفس الفترة الزمنية، مما يمنحهم المزيد من الوقت لكتابة منطق العمل وأجزاء أخرى من التعليمات البرمجية.
بالإضافة إلى ذلك، تمكّنوا من تنفيذ المزيد من المهام باستخدام واجهة المستخدم نفسها، مثل دمج الصور المتحركة واستخدام واجهات برمجة تطبيقات بسيطة مثل AnimatedVisibility وCrossfade وAnimatable.
تخطط شركة Mercari لمواصلة استخدام Jetpack Compose في تطبيقها الجديد حتى يتم إطلاقه. وتم أيضًا تصميم نظام التصميم الذي يتضمّن حزمة تطوير البرامج (SDK) لنظام التشغيل Android في Jetpack Compose للعمل مع تطبيقات متعددة ضِمن Mercari.
البدء
تعرَّف على مزيد من المعلومات عن Jetpack Compose.
يخضع كل من المحتوى وعيّنات التعليمات البرمجية في هذه الصفحة للتراخيص الموضحّة في ترخيص استخدام المحتوى. إنّ Java وOpenJDK هما علامتان تجاريتان مسجَّلتان لشركة Oracle و/أو الشركات التابعة لها.
تاريخ التعديل الأخير: 2021-05-19 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2021-05-19 (حسب التوقيت العالمي المتفَّق عليه)"],[],[],null,["# Mercari improves UI development productivity by 56% with Jetpack Compose\n\n[Mercari](https://play.google.com/store/apps/details?id=com.kouzoh.mercari) allows millions of people to shop and sell almost anything. The company was founded in 2013 in Japan, and it now is the largest smartphone-focused C2C marketplace in Japan. Mercari's Client Architect Team started using [Jetpack Compose](https://developer.android.com/jetpack/compose) in 2020 with the goal of using modern solutions and technologies that can scale for the long term to build their tech stack for new applications.\n\nWhat they did\n-------------\n\nThe Mercari team needed to implement a design system with complex state management and styling on Android Views --- a very complex task. Using Jetpack Compose, they were not only able to implement this complex system, it helped them spend less time developing each screen.\n\nJetpack Compose also helped the team write UI code for their new app utilizing the design system, making their UI code concise and easy to understand. As a result, the team can spend more time writing screens and business logic, such as practical support for the dark theme.\n\nIn addition, the Mercari team wrote a proof-of-concept tool for integrating Figma with the design system, which automatically generates UI code from the component designs. The team said that developing this tool was easier with Compose due to its declarative nature.\n\n*\"Once Android developers get used to writing Jetpack Compose code, they wouldn't wish to go back.\" - Anthony Allan Conda, Android Tech Lead at Mercari*\n\nResults\n-------\n\nBetween Jetpack Compose and their new design system, Mercari was able to use far less code to write screens. On screens with infinitely-scrollable content --- a common use case --- they actually reduced their code by about 56%. As a result, they were able to write more screens in the same amount of time, giving them more time to write business logic and other parts of the code.\n\nAlso, they were able to do more with the UI itself, such as incorporating animations and using intuitive APIs such as *AnimatedVisibility* , *Crossfade* , and *Animatable*.\n\nMercari is planning to continue using Jetpack Compose in their new application until its release. Their design system, with the Android SDK written in Jetpack Compose, is also designed to work with multiple applications within Mercari.\n\nGet started\n-----------\n\nLearn more about [Jetpack Compose](https://developer.android.com/jetpack/compose)."]]