‫TikTok با Jetpack Compose اندازه کد را ۵۸٪ کاهش می‌دهد و عملکرد برنامه را برای ویژگی‌های جدید بهبود می‌بخشد

TikTok یک پلاتفرم جهانی ویدیوهای کوتاه است که به‌خاطر پایگاه کاربری عظیم و ویژگی‌های نوآورانه‌اش شناخته می‌شود. این تیم دائماً درحال انتشار به‌روزرسانی‌ها، آزمایش‌ها، و ویژگی‌های جدید برای کاربران خود است. تیم Android در TikTok با چالش حفظ سرعت در حین مدیریت بدهی فنی مواجه شد و به Jetpack Compose روی آورد.

تیم می‌خواست تکرار سریع‌تر و با کیفیت بالاتری از الزامات محصول را فعال کند. با بهره‌گیری از Compose، تیم به‌دنبال بهبود کارایی مهندسی ازطریق نوشتن کد کمتر و کاهش بار شناختی بود، و درعین‌حال به عملکرد و پایداری بهتری دست یافت. 

ساده‌سازی میانای کاربر پیچیده برای تسریع بهره‌وری توسعه‌دهنده

صفحه‌های TikTok اغلب پیچیده‌تر از آنچه به‌نظر می‌رسد هستند و حاوی الزامات شرطی لایه‌ای متعددی هستند. این پیچیدگی اغلب منجر به سلسله‌مراتب View با ساختار غیربهینه و دشوار برای نگهداری و تودرتویی بیش‌ازحد View می‌شد که به‌دلیل افزایش تعداد دفعات اندازه‌گیری، باعث کاهش عملکرد می‌شد.

Compose راه‌حل مستقیمی برای این مشکل ساختاری ارائه داد. 

علاوه‌براین، راهبرد اندازه‌گیری Compose به کاهش مالیات مضاعف کمک می‌کند و بهینه‌سازی عملکرد اندازه‌گیری را آسان‌تر می‌کند. 

برای بهبود بهره‌وری توسعه‌دهندگان، تیم مرکزی «سیستم طراحی» TikTok کتابخانه مؤلفه‌ای برای تیم‌هایی که روی ویژگی‌های مختلف برنامه کار می‌کنند ارائه می‌دهد.  این تیم مشاهده کرد که توسعه در Compose ساده است؛ استفاده از composableهای کوچک بسیار مؤثر است، درحالی‌که گنجاندن بلوک‌های بزرگ واسط کاربر با منطق شرطی هم ساده است و هم سربار کمی دارد.

ایجاد مسیری روبه‌جلو ازطریق انتقال راهبردی

‫TikTok با اتخاذ استراتژیک Jetpack Compose توانست بر بدهی فنی غلبه کند و درعین‌حال به تمرکز بر ایجاد تجربه‌های عالی برای کاربرانش ادامه دهد. توانایی Compose در مدیریت منطق شرطی به‌صورت تمیز و ساده‌سازی ترکیب‌بندی به تیم اجازه داد تا در صفحات جدید یا کاملاً بازنویسی‌شده، زمان بارگیری صفحه را تا ۷۸٪ کاهش دهد. این بهبود در موارد کوچک‌تر ۲۰ تا ۳۰ درصد و برای بازنویسی‌های کامل و ویژگی‌های جدید ۷۰ تا ۸۰ درصد بود. آن‌ها همچنین توانستند اندازه کد خود را تا ۵۸٪ کاهش دهند، در مقایسه با همان ویژگی ساخته‌شده در Views. تیم همچنین چند نکته را که یاد گرفته است هم‌رسانی کرده است:  

استراتژی کلی تیم TikTok این بود که مسیرهای کاربر خاص را به‌صورت افزایشی منتقل کند. این کار به آن‌ها فرصت داد تا مهاجرت کنند، مزایای قابل‌اندازه‌گیری را تأیید کنند، و سپس به صفحه‌های بیشتری مقیاس‌بندی کنند. آن‌ها بااستفاده از Compose برای ساده‌سازی ساختار کلی در ویژگی رمزینه پاسخ‌سریع شروع کردند و شاهد بهبودهایی بودند. تیم بعداً انتقال را به تجربه‌های «ورود به سیستم» و «ثبت‌نام» گسترش داد. 

تیم چند نکته دیگر را هم‌رسانی کرد:  

هنگام بررسی عملکرد درطول انتقال، تیم TikTok متوجه شد که استفاده از تعداد زیادی ComposeViews کوچک برای جایگزینی عناصر داخل یک ViewHolder منفرد باعث سربار ترکیب‌بندی می‌شود. آن‌ها با گسترش انتقال برای استفاده از یک ComposeView واحد برای کل ViewHolder، به نتایج بهتری دست یافتند.

هنگام انتقال Fragment در ViewPager، که دارای منطق ارتفاع سفارشی و منطق شرطی برای پنهان کردن و نمایش واسط کاربر براساس آزمایش‌ها است، عملکرد تحت تأثیر قرار نگرفت. در این مورد، انتقال ViewPager به Composable عملکرد بهتری نسبت به انتقال Fragment داشت. 

جون شن واقعاً از اینکه Compose «مقدار کد موردنیاز برای توسعه ویژگی را کاهش می‌دهد، قابلیت آزمایش را بهبود می‌بخشد، و تحویل را تسریع می‌کند» خوشش می‌آید. تیم قصد دارد به‌طور پیوسته پذیرش Compose را افزایش دهد و آن را به چارچوب ترجیحی خود در بلندمدت تبدیل کند. ‫Jetpack Compose ثابت کرد که راهکاری قدرتمند برای بهبود تجربه توسعه‌دهنده و سنجه‌های تولید در مقیاس بزرگ است.

شروع به کار با Jetpack Compose

درباره اینکه Jetpack Compose چگونه می‌تواند به تیم شما کمک کند بیشتر بدانید.