প্রকৃত ব্যবহারকারীর মনিটরিং সরঞ্জামগুলি ব্যবহার করে এবং তাদের অ্যাপ রিফ্যাক্টর করার ক্ষেত্রে কোর ওয়েব ভাইটালগুলিকে উন্নত করার উপর ফোকাস করে, তারা CLS 72% উন্নত করেছে, সেইসাথে অ্যাপ্লিকেশন প্রতিক্রিয়াশীলতা।
অ্যাগ্রোফি ল্যাটিন আমেরিকার কৃষি ব্যবসা বাজারের জন্য একটি অনলাইন মার্কেটপ্লেস। তারা খামার মেশিন, জমি, সরঞ্জাম এবং আর্থিক পরিষেবাগুলির ক্রেতা এবং বিক্রেতাদের সাথে মেলে। Q3 2020-এ Agrofy-এ একটি 4-ব্যক্তির উন্নয়ন দল তাদের ওয়েবসাইট অপ্টিমাইজ করতে এক মাস ব্যয় করেছে কারণ তারা অনুমান করেছিল যে উন্নত কর্মক্ষমতা বাউন্স রেট কমিয়ে দেবে। তারা বিশেষভাবে এলসিপি উন্নত করার দিকে মনোনিবেশ করেছে, যা মূল ওয়েব ভাইটালগুলির মধ্যে একটি। এই পারফরম্যান্স অপ্টিমাইজেশানগুলি এলসিপিতে 70% উন্নতির দিকে পরিচালিত করে, যা লোড পরিত্যাগের 76% হ্রাসের সাথে সম্পর্কযুক্ত (3.8% থেকে 0.9%)।
70 %
নিম্ন LCP
76 %
নিম্ন লোড পরিত্যাগ
সমস্যা
তাদের ব্যবসায়িক মেট্রিক্স অধ্যয়ন করার সময়, Agrofy-এর একটি উন্নয়ন দল লক্ষ্য করেছে যে তাদের বাউন্স রেট শিল্পের বেঞ্চমার্কের চেয়ে বেশি বলে মনে হচ্ছে। ওয়েবসাইটের কোডবেজে প্রযুক্তিগত ঋণও বাড়ছিল।
সমাধান
এগ্রোফি টিম তাদের আধিকারিকদের প্রস্তুত করেছে এবং এতে কেনা-ইন করেছে:
- একটি পুরানো, অবচিত ফ্রেমওয়ার্ক থেকে একটি নতুন, সক্রিয়ভাবে সমর্থিত একটিতে স্থানান্তর করুন৷
- নতুন কোডবেসের লোড কর্মক্ষমতা অপ্টিমাইজ করুন।
মাইগ্রেশনে 2 মাস সময় লেগেছে। পূর্বে উল্লিখিত 4-ব্যক্তির উন্নয়ন দল ছাড়াও, এই মাইগ্রেশনে পণ্য এবং UX বিশেষজ্ঞ এবং একজন সফ্টওয়্যার স্থপতিও জড়িত। অপ্টিমাইজেশান প্রকল্পটি 4-ব্যক্তি উন্নয়ন দলকে 1 মাস সময় নিয়েছে। তারা এলসিপি, সিএলএস (অন্য একটি কোর ওয়েব ভাইটালস মেট্রিক), এবং এফসিপি- তে ফোকাস করেছে। নির্দিষ্ট অপ্টিমাইজেশান অন্তর্ভুক্ত:
- ইন্টারসেকশন অবজারভার এপিআই এর সাথে সমস্ত অদৃশ্যমান উপাদান লোড করা হচ্ছে।
- একটি বিষয়বস্তু বিতরণ নেটওয়ার্কের সাথে দ্রুত স্থিতিশীল সংস্থান সরবরাহ করা।
-
loading="lazy"সহ অলস লোডিং চিত্র । - সমালোচনামূলক রেন্ডারিং পাথ বিষয়বস্তুর সার্ভার-সাইড রেন্ডারিং ।
- হ্যান্ডশেকের সময় কমাতে গুরুত্বপূর্ণ সংস্থানগুলি প্রিলোড করা এবং পূর্ব-সংযোগ করা ।
- কোন পণ্যের বিস্তারিত পৃষ্ঠাগুলি প্রচুর লেআউট পরিবর্তনের সম্মুখীন হয়েছে তা সনাক্ত করতে বাস্তব ব্যবহারকারী মনিটরিং (RUM) সরঞ্জামগুলি ব্যবহার করে এবং তারপর কোডবেসের আর্কিটেকচারে সামঞ্জস্য করুন।
আরও প্রযুক্তিগত বিবরণের জন্য Agrofy ইঞ্জিনিয়ারিং ব্লগ পোস্ট দেখুন।
20% ট্র্যাফিকের উপর নতুন কোডবেস সক্ষম করার পরে, তারা সেপ্টেম্বর 2020 এর প্রথম দিকে সমস্ত দর্শকদের জন্য নতুন সাইট চালু করেছে।
ফলাফল
উন্নয়ন দলের অপ্টিমাইজেশানগুলি বিভিন্ন মেট্রিক্সে পরিমাপযোগ্য উন্নতির দিকে পরিচালিত করেছে:
- LCP 70% উন্নত হয়েছে।
- CLS 72% উন্নত হয়েছে।
- JS অনুরোধ ব্লক করা 100% এবং CSS অনুরোধগুলি 80% ব্লক করা কমেছে।
- দীর্ঘ কাজগুলি 72% হ্রাস পেয়েছে।
- প্রথম CPU নিষ্ক্রিয় 25% উন্নত হয়েছে।
একই সময়ের মধ্যে, প্রকৃত ব্যবহারকারীর পর্যবেক্ষণ ডেটা ( ফিল্ড ডেটা নামেও পরিচিত) দেখিয়েছে যে পণ্যের বিস্তারিত পৃষ্ঠাগুলিতে লোড পরিত্যাগের হার 3.8% থেকে 0.9%-এ নেমে এসেছে 76%:
