مطالعات موردی

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

مطالعه ۲ دقیقه‌ای
Ben Trengrove و Ajesh Pai

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

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

ساده‌سازی رابط کاربری پیچیده برای افزایش بهره‌وری توسعه‌دهندگان

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

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

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

برای بهبود بهره‌وری توسعه‌دهندگان، تیم مرکزی سیستم طراحی تیک‌تاک یک کتابخانه کامپوننت برای تیم‌هایی که روی ویژگی‌های مختلف برنامه کار می‌کنند، فراهم می‌کند. این تیم مشاهده کرد که توسعه در Compose ساده است؛ استفاده از Composableهای کوچک بسیار مؤثر است، در حالی که ترکیب بلوک‌های بزرگ رابط کاربری با منطق شرطی هم ساده است و هم سربار کمی دارد.

junShenTikTok.png

ایجاد مسیری رو به جلو از طریق مهاجرت استراتژیک

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

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

این تیم برخی از یافته‌های اضافی خود را به اشتراک گذاشت:

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

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

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

شروع کار با جت‌پک کامپوز

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

    نوشته شده توسط:

    ادامه مطلب