‫TikTok يقلّل حجم الرمز البرمجي بنسبة% 58 ويحسِّن أداء التطبيق للميزات الجديدة باستخدام Jetpack Compose

TikTok هي منصة عالمية للفيديوهات القصيرة تشتهر بقاعدة مستخدميها الضخمة وميزاتها المبتكرة. يُصدر الفريق باستمرار تحديثات وتجارب وميزات جديدة للمستخدمين. في مواجهة تحدي الحفاظ على السرعة أثناء إدارة الديون الفنية، لجأ فريق TikTok Android إلى Jetpack Compose.

أراد الفريق تكرار متطلبات المنتج بشكل أسرع وأعلى جودة. من خلال الاستفادة من Compose، سعى الفريق إلى تحسين الكفاءة الهندسية من خلال كتابة رموز برمجية أقل وتقليل العبء المعرفي، مع تحقيق أداء واستقرار أفضل أيضًا. 

تبسيط واجهة المستخدم المعقدة لزيادة إنتاجية المطوّرين

غالبًا ما تكون صفحات TikTok أكثر تعقيدًا مما تبدو عليه، إذ تحتوي على العديد من المتطلبات الشرطية المتعدّدة الطبقات. غالبًا ما كان هذا التعقيد يؤدي إلى صعوبة في صيانة هيكليات طرق العرض، وإلى تداخل مفرط في طرق العرض، ما تسبّب في تراجع الأداء بسبب زيادة عدد عمليات القياس.

قدّم Compose حلاً مباشرًا لهذه المشكلة الهيكلية. 

بالإضافة إلى ذلك، تساعد استراتيجية القياس في Compose على تقليل الازدواج الضريبي، ما يسهّل تحسين أداء القياس. 

لتحسين إنتاجية المطوّرين، يوفّر فريق Design System المركزي في TikTok مكتبة مكوّنات للفِرق التي تعمل على ميزات مختلفة في التطبيق.  لاحظ الفريق أنّ التطوير في Compose بسيط، وأنّ الاستفادة من الدوال المركّبة الصغيرة فعّالة للغاية، في حين أنّ دمج مجموعات واجهة المستخدم الكبيرة مع المنطق الشرطي أمر بسيط ولا يتطلّب سوى الحد الأدنى من النفقات العامة.

بناء مسار للمضي قدمًا من خلال عملية نقل استراتيجية

من خلال استخدام Jetpack Compose بشكل استراتيجي، تمكّن TikTok من مواكبة الديون التقنية، مع مواصلة التركيز على إنشاء تجارب رائعة للمستخدمين. بفضل قدرة Compose على التعامل مع المنطق الشرطي بسلاسة وتبسيط عملية الإنشاء، تمكّن الفريق من تقليل وقت تحميل الصفحة بنسبة تصل إلى% 78 على الصفحات الجديدة أو التي تمت إعادة كتابتها بالكامل. وقد بلغت نسبة هذا التحسُّن من %20 إلى %30 في الحالات الأصغر، ومن %70 إلى %80 في عمليات إعادة الكتابة الكاملة والميزات الجديدة. وتمكّنوا أيضًا من تقليل حجم الرمز بنسبة%58 مقارنةً بالميزة نفسها المضمّنة في Views. وقد شارك الفريق أيضًا بعض المعلومات:  

كانت الاستراتيجية العامة لفريق TikTok هي نقل تجارب مستخدمين معيّنة بشكل تدريجي. وقد أتاح ذلك لهم فرصة نقل البيانات والتأكّد من المزايا القابلة للقياس، ثم توسيع نطاق الاستخدام ليشمل المزيد من الشاشات. بدأوا باستخدام Compose لتبسيط البنية العامة في ميزة رمز الاستجابة السريعة ولاحظوا التحسينات. بعد ذلك، وسّع الفريق نطاق عملية النقل لتشمل تجارب تسجيل الدخول والاشتراك. 

شارك الفريق بعض الدروس الإضافية:  

أثناء التحقّق من الأداء خلال عملية النقل، وجد فريق TikTok أنّ استخدام العديد من عناصر ComposeViews الصغيرة لاستبدال العناصر داخل عنصر ViewHolder واحد، تسبّب في زيادة عبء الإنشاء. وقد حقّقوا نتائج أفضل من خلال توسيع نطاق عملية النقل لاستخدام ComposeView واحد لكل ViewHolder.

عند نقل Fragment داخل ViewPager، الذي يتضمّن منطق ارتفاع مخصّصًا ومنطقًا شرطيًا لإخفاء واجهة المستخدم وإظهارها استنادًا إلى التجارب، لم يتأثر الأداء. في هذه الحالة، كان أداء نقل ViewPager إلى دالة مركّبة أفضل من نقل Fragment. 

يعجب "جون شين" كثيرًا أنّ Compose "يقلّل من مقدار الرموز البرمجية المطلوبة لتطوير الميزات، ويحسّن قابلية الاختبار، ويسرّع عملية التسليم". يخطّط الفريق لزيادة استخدام Compose بشكل مطّرد، ما يجعله إطار العمل المفضّل لديه على المدى الطويل. أثبتت أداة Jetpack Compose أنّها حلّ فعّال لتحسين تجربة المطوّرين ومقاييس الإنتاج على نطاق واسع.

بدء استخدام Jetpack Compose

تعرَّف على مزيد من المعلومات حول كيفية استفادة فريقك من Jetpack Compose .