আমি কীভাবে বড় জেএস লাইব্রেরি লোড করার ব্যয় হ্রাস করতে পারি?


23

আমি যদি আমার পৃষ্ঠার জন্য একটি বৃহত জাভাস্ক্রিপ্ট লাইব্রেরি ব্যবহার করছি, তবে কীভাবে আমি এটি নিশ্চিত করতে পারি যে এটি সাইটের ব্যবহারকারীর ব্যবহারকে ক্ষতিগ্রস্থ করে না?

উত্তর:


25

আপনি করতে পারেন 4 টি জিনিস।

  1. আপনার জেএস ফাইলটি মিনিফাই করুন। এটি এর আকার হ্রাস করতে সমস্ত মন্তব্য এবং হোয়াইটস্পেস সরিয়ে দেয়।
  2. প্রতিটি পৃষ্ঠায় আপনার জেএস ফাইলগুলি একত্রিত করুন যাতে কেবল 1 টি ফাইল থাকে।
  3. আপনার ফাইলগুলি প্রেরণ করার সময় প্যাকেজটি ব্যবহার করুন to এটি তাদের আরও ছোট করে তুলবে
  4. পৃষ্ঠার নীচে তত্ক্ষণাত প্রয়োজন নেই এমন জাভাস্ক্রিপ্টটি রাখুন যাতে এটি শেষের দিকে লোড হয়। এটি জেএস সম্পূর্ণরূপে লোড হওয়ার আগেই পৃষ্ঠাটি দেখতে এবং ব্যবহারের অনুমতি দেয়।

এবং অন্য কিছু লোক পরামর্শ দিয়েছেন:

  • অ্যাপাচি স্বয়ংক্রিয়ভাবে সংকোচন (এবং সংক্রামিত সামগ্রীর ক্যাশিং) পরিচালনা করবে যা ফাইলগুলির পরিচালনা ব্যাপকভাবে সরল করে
  • জাভাস্ক্রিপ্টটি যথাযথভাবে ক্যাশে-সক্ষম করা বড় সুবিধা অর্জন করবে।
  • ওয়াইল্ডকার্ড ডোমেনগুলি (একাধিক ইউআরআই সহ) আরও সমবর্তী সংযোগের অনুমতি দেবে। প্রাক-আনয়ন কেবল চিত্র /

আপনি আরও কিছু করতে পারেন এবং এগুলি করার আরও ভাল উপায়। অ্যাপাচি স্বয়ংক্রিয়ভাবে সংক্ষেপণ (এবং সংক্রামিত সামগ্রীর ক্যাশিং) পরিচালনা করবে যা ফিলের পরিচালনা ব্যাপকভাবে সহজ করে। জাভাস্ক্রিপ্টকে যথাযথভাবে ক্যাশেযোগ্য করে তোলা বড় সুবিধা উপভোগ করবে। ওয়াইল্ডকার্ড ডোমেনগুলি (একাধিক ইউআরআই সহ) আরও সমবর্তী সংযোগের অনুমতি দেবে। প্রাক-আনয়ন কেবল চিত্রগুলির জন্য নয়
সিমকিয়ান

21

আপনি যদি সাধারণ লাইব্রেরি ব্যবহার করেন (যেমন jQuery, প্রোটোটাইপ বা ডোজো), আপনি ফাইলটি গুগলে অফলোড করে সেটিকে পরিবেশন করতে পারেন , এটি আপনাকে বেশ কয়েকটি সুবিধা দেয়:

  • আপনাকে খাটো করা এবং জিপ করা ইত্যাদি সম্পর্কে চিন্তা করতে হবে না
  • এটি আপনার ব্যান্ডউইথ নয়
  • এই ফাইলগুলি একটি অন্য ডোমেন থেকে আসে, সুতরাং আপনি হোস্টনামে 2 সমান্তরাল অনুরোধের সীমাটি সীমাবদ্ধ করতে পারেন (কমপক্ষে আংশিকভাবে)
  • আপনি যদি ভাগ্যবান হন তবে ব্যবহারকারী ইতিমধ্যে একই সাইট থেকে একই সরবরাহকারীর অন্য কিছু সাইট পরিদর্শন করেছেন যা তারা ইতিমধ্যে ব্রাউজার ক্যাশে রয়েছে।

দ্রষ্টব্য: আপনি যে সংস্করণটির জন্য জিজ্ঞাসা করেছেন তা ক্যাশিং বৈশিষ্ট্যগুলিতে একটি বিশাল প্রভাব ফেলতে পারে: jQuery 1.4.2 জিজ্ঞাসা করার ফলে আপনাকে এমন একটি ফাইল দেওয়া হবে যা এক বছরের জন্য ক্যাশে রাখা যায়, তবে ১.৪ ঘন্টার জন্য কেবল ক্যাশে রাখা যায়।


1
+1 যা CDN জন্য, এবং scriptsrc.net করতে এটা আরও সহজ;)
আপনি Agos

1
আপনি আপনার 'নোট' প্রসারিত করতে পারেন? কেন ক্যাচিংয়ের সময়টিতে পার্থক্য রয়েছে?
theycallmemorty

2
@ থাইক্যালমেমার্টি: আমি যখন ডকগুলি পরীক্ষা করে নিই, তখন আমি অনুমান করব যে এটি ১.৪.২ উল্লেখ করে আপনি যে সংস্করণটি চান তা সম্পর্কে খুব সুনির্দিষ্ট রয়েছেন, এবং ১.৪ জিজ্ঞাসা করার সময় আপনি মূলত বলছেন "আমাকে সর্বাধিক দিন ১.৪ "এর নীচে সাম্প্রতিক সংস্করণ, সুতরাং তারা এটিকে ভারী হিসাবে ক্যাশে করছে না।
ঝাফ - বেন ডুগুইড

আরও লক্ষণীয় যে মাইক্রোসফ্ট তাদের সিডিএনতে
বার্ট ল্যাম্ব

6

আপনি পুরো লাইব্রেরিটি একটি জেএস ফাইলের মধ্যে রাখতে পারেন এবং ফাইলটি সংকুচিত করতে পারেন। তবে এটি কেবলমাত্র কোনও পৃষ্ঠার প্রথম লোডিংয়ের জন্য গুরুত্বপূর্ণ। এর পরে আপনার জেএস ফাইলটি ব্রাউজারে ক্যাশে হবে, বিশেষত যদি আপনি যথেষ্ট পরিমাণে ক্যাশে-মেয়াদ নির্ধারণ করেন। অতএব কোন ক্রমাগত আঘাত আপনার js ফাইল আর লোড করবে না।


আপনার জন্য +1 পুরো লাইব্রেরিটি একটি ফাইলে রেখে সংকোচ করতে পারেন। ভেবে দেখিনি।
গর্ডন গুস্তাফসন

4

উপরের উত্তরগুলি ছাড়াও, আপনি অন্যান্য তৃতীয় পক্ষের লাইব্রেরি (jQuery, YUI, মটুল ইত্যাদি) সাথে সংহত করার সময় আপনার জেএসকে স্বয়ংক্রিয়ভাবে সংকুচিত করতে এবং অনুকূল করতে গুগল ক্লোজার সংকলকটি ব্যবহার করতে পারেন j


0

আপনার যদি বেশ কয়েকটি পৃষ্ঠা উপাদান এবং পৃথক ডোমেনে অ্যাক্সেস থাকে তবে আপনি দ্বিতীয় ডোমেনে বড় জেএস ফাইল সহ সমস্ত স্থিতিশীল ফাইল হোস্টিং বিবেচনা করতে পারেন।

স্টিভ সাউডার তাঁর উচ্চ পারফরম্যান্স ওয়েব সাইট ব্লগে যেমন নোট করেছেন -

... কিছু পরিস্থিতিতে, একক ডোমেনে ডাউনলোড করা একাধিক সংস্থান গ্রহণ করা এবং একাধিক ডোমেন জুড়ে বিভক্ত করা সার্থক। আমি এই ডোমেন শারডিং কল। এটি করার ফলে সামগ্রিক পৃষ্ঠা লোডের সময় হ্রাস করে সমান্তরালে আরও সংস্থানগুলি ডাউনলোড করা যায়।

তিনি অন্য কোথাও লিখেছেন ..

ব্রাউজারগুলি প্রতিটি ডোমেনের মধ্যে সংখ্যার সীমিত সংখ্যক খোলায় ... দুটি ডোমেন জুড়ে অনুরোধগুলি বিভক্ত করা বা শারড করা, একটি ডোমেনের বিপরীতে, দ্রুত পৃষ্ঠাতে ফলাফল হয়, বিশেষত আই 6 এবং 7 এ

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.