দ্রুত ওয়েবসাইটের জন্য Nginx দিয়ে স্ট্যাটিক অ্যাসেট ক্যাশ করা
স্ট্যাটিক অ্যাসেট ক্যাশিং কেন গুরুত্বপূর্ণ
প্রতিবার যখন একজন ব্যবহারকারী আপনার ওয়েবসাইট ভিজিট করেন, তাদের ব্রাউজার ডজনখানেক স্ট্যাটিক অ্যাসেট অনুরোধ করে: CSS ফাইল, জাভাস্ক্রিপ্ট, ছবি, ফন্ট এবং আরও অনেক কিছু। সঠিক ক্যাশিং ছাড়া, প্রতিটি অনুরোধ আপনার সার্ভারে আঘাত করে, লোড টাইম এবং ব্যান্ডউইথ ব্যবহার বাড়ায়। Nginx, একটি উচ্চ-পারফরম্যান্স ওয়েব সার্ভার, ব্রাউজারকে এই অ্যাসেটগুলি স্থানীয়ভাবে ক্যাশ করতে বলে এবং সার্ভার সাইডে ক্যাশ করে এটি নাটকীয়ভাবে উন্নত করতে পারে।
এই গাইডে, আপনি শিখবেন কিভাবে Nginx কনফিগার করে স্ট্যাটিক অ্যাসেট কার্যকরভাবে ক্যাশ করা যায়, লেটেন্সি এবং সার্ভার লোড কমিয়ে।
ব্রাউজার ক্যাশিং বনাম সার্ভার-সাইড ক্যাশিং বোঝা
এখানে দুটি প্রধান ধরনের ক্যাশিং প্রাসঙ্গিক:
- ব্রাউজার ক্যাশিং: ব্রাউজার HTTP হেডার যেমন
Cache-ControlএবংExpiresএর উপর ভিত্তি করে অ্যাসেট স্থানীয়ভাবে সংরক্ষণ করে। পরবর্তী ভিজিটে ডিস্ক থেকে অ্যাসেট লোড হয়, নেটওয়ার্ক অনুরোধ এড়িয়ে। - সার্ভার-সাইড ক্যাশিং: Nginx মেমরি বা ডিস্কে প্রতিক্রিয়া সংরক্ষণ করে এবং পুনরাবৃত্ত অনুরোধের জন্য সরাসরি পরিবেশন করে, ব্যাকএন্ড লোড কমায়।
উভয়ই পারফরম্যান্সের জন্য গুরুত্বপূর্ণ। আমরা উভয়ই কভার করব।
ধাপ ১: Expires হেডার দিয়ে ব্রাউজার ক্যাশিং কনফিগার করুন
ব্রাউজার ক্যাশিং সক্রিয় করার সহজ উপায় হল আপনার Nginx কনফিগারেশনে expires নির্দেশাবলী যোগ করা। এটি Expires এবং Cache-Control হেডার সেট করে।
আপনার সাইটের কনফিগারেশন ফাইল খুলুন (যেমন, /etc/nginx/sites-available/example.com) এবং স্ট্যাটিক অ্যাসেটের জন্য একটি location ব্লক যোগ করুন:
location ~* \.(css|js|jpg|jpeg|png|gif|ico|svg|woff|woff2|ttf|eot)$ {
expires 1y;
add_header Cache-Control "public, immutable";
}
এটি ব্রাউজারকে এই ফাইলগুলি এক বছরের জন্য ক্যাশ করতে বলে। immutable নির্দেশাবলী নির্দেশ করে যে ফাইলটি কখনই পরিবর্তন হবে না, তাই ব্রাউজার রিলোডে পুনরায় যাচাই করবে না।
সেরা অনুশীলন: সংস্করণযুক্ত ফাইলনাম ব্যবহার করুন (যেমন, style.abc123.css) যাতে আপনি ক্যাশিং ভাঙা ছাড়াই অ্যাসেট আপডেট করতে পারেন। যখন ফাইল পরিবর্তন হয়, ফাইলনাম পরিবর্তন হয়, এবং ব্রাউজার নতুন সংস্করণ আনয়ন করে।
ধাপ ২: প্রক্সি ক্যাশ দিয়ে সার্ভার-সাইড ক্যাশিং সক্রিয় করুন
যদি আপনি Nginx এর পিছনে একটি অ্যাপ্লিকেশন সার্ভার (যেমন Node.js, Python, বা PHP) চালান, আপনি ব্যাকএন্ড অনুরোধ কমাতে Nginx এ স্ট্যাটিক প্রতিক্রিয়া ক্যাশ করতে পারেন।
প্রথমে, nginx.conf এর http ব্লকে একটি ক্যাশ পাথ নির্ধারণ করুন:
proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=static_cache:10m max_size=1g inactive=60m use_temp_path=off;
তারপর, আপনার সার্ভার ব্লকে এটি ব্যবহার করুন:
location ~* \.(css|js|jpg|jpeg|png|gif|ico|svg)$ {
proxy_cache static_cache;
proxy_cache_valid 200 302 1y;
proxy_cache_valid 404 1m;
proxy_cache_use_stale error timeout updating http_500 http_502 http_503 http_504;
proxy_cache_lock on;
add_header X-Cache-Status $upstream_cache_status;
proxy_pass http://backend;
}
এটি সফল প্রতিক্রিয়া এক বছরের জন্য ক্যাশ করে এবং ব্যাকএন্ড ডাউন থাকলে পুরানো কন্টেন্ট পরিবেশন করে। X-Cache-Status হেডার আপনাকে ডিবাগ করতে সাহায্য করে (HIT, MISS, ইত্যাদি)।
ধাপ ৩: কম্প্রেশন এবং HTTP/2 দিয়ে অপ্টিমাইজ করুন
ক্যাশিং অনুরোধ কমায়, কিন্তু আপনি gzip কম্প্রেশন এবং HTTP/2 সক্রিয় করে স্থানান্তর আরও দ্রুত করতে পারেন।
nginx.conf এ gzip সক্রিয় করুন:
gzip on;
gzip_types text/css application/javascript image/svg+xml;
gzip_min_length 1000;
HTTP/2 অনুরোধ মাল্টিপ্লেক্স করে এবং আপনার listen নির্দেশাবলীতে http2 যোগ করে সক্রিয় করা হয়:
listen 443 ssl http2;
দ্রষ্টব্য: HTTP/2 এর জন্য HTTPS প্রয়োজন। যদি আপনি এখনও TLS সেট আপ না করে থাকেন, আমাদের গাইড দেখুন কিভাবে HTTPS এবং TLS কাজ করে।
তুলনা: Cache-Control নির্দেশাবলী
| নির্দেশাবলী | অর্থ | সুপারিশকৃত |
|---|---|---|
public |
প্রতিক্রিয়া যেকোনো ক্যাশ দ্বারা ক্যাশ করা যেতে পারে | স্ট্যাটিক অ্যাসেট |
private |
প্রতিক্রিয়া একটি একক ব্যবহারকারীর জন্য | ব্যবহারকারী-নির্দিষ্ট ডেটা |
no-cache |
সার্ভারের সাথে পুনরায় যাচাই করতে হবে | HTML পৃষ্ঠা |
no-store |
কখনই ক্যাশ করবেন না | সংবেদনশীল ডেটা |
immutable |
কন্টেন্ট পরিবর্তন হবে না | সংস্করণযুক্ত অ্যাসেট |
ধাপ ৪: পরীক্ষা এবং যাচাই করুন
পরিবর্তন প্রয়োগ করার পরে, Nginx রিলোড করুন: sudo nginx -s reload। তারপর curl দিয়ে পরীক্ষা করুন:
curl -I https://example.com/style.css
Cache-Control এবং Expires হেডার খুঁজুন। আপনি ব্রাউজার DevTools (Network ট্যাব) ব্যবহার করে দেখতে পারেন অ্যাসেট ক্যাশ থেকে পরিবেশন করা হচ্ছে কিনা (Status 200 বা 304)।
সার্ভার-সাইড ক্যাশের জন্য, X-Cache-Status হেডার মনিটর করুন।
সাধারণ সমস্যা এবং সেরা অনুশীলন
- HTML ক্যাশ করবেন না: HTML ডায়নামিক হওয়া উচিত বা আপডেট প্রতিফলিত করতে সংক্ষিপ্ত ক্যাশ সময় থাকা উচিত।
- সংস্করণ ব্যবহার করুন: কন্টেন্ট পরিবর্তন হলে ক্যাশ ভাঙতে ফাইলনামে হ্যাশ যোগ করুন।
- উপযুক্ত max-age সেট করুন: সংস্করণযুক্ত অ্যাসেটের জন্য এক বছর নিরাপদ।
- ক্যাশ আকার মনিটর করুন: সার্ভার-সাইড ক্যাশ বাড়তে পারে;
max_sizeএবংinactiveসেট করুন। - CDN বিবেচনা করুন: বিশ্বব্যাপী দর্শকদের জন্য, একটি CDN ব্যবহারকারীদের কাছাকাছি অ্যাসেট ক্যাশ করতে পারে।
FAQ
আমি কিভাবে জানব আমার অ্যাসেট ক্যাশ করা হচ্ছে?
curl -I বা ব্রাউজার DevTools দিয়ে প্রতিক্রিয়া হেডার পরীক্ষা করুন। Cache-Control: public, max-age=31536000 এবং Expires হেডার খুঁজুন। DevTools-এ, Size কলাম ক্যাশ করা অ্যাসেটের জন্য "(from disk cache)" দেখাবে।
expires এবং Cache-Control এর মধ্যে পার্থক্য কি?
expires একটি পরম তারিখ সেট করে, যেখানে Cache-Control আপেক্ষিক সেকেন্ড ব্যবহার করে। আধুনিক ব্রাউজারে Cache-Control অগ্রাধিকার পায়। Nginx এর expires নির্দেশাবলী উভয়ই সেট করে সামঞ্জস্যের জন্য।
আমি কি ডায়নামিক কন্টেন্ট ক্যাশ করতে পারি?
হ্যাঁ, কিন্তু সতর্কতার সাথে। সংক্ষিপ্ত TTL সহ proxy_cache ব্যবহার করুন এবং কুকি বা হেডারের উপর ভিত্তি করে ক্যাশ কী বিবেচনা করুন। ব্যবহারকারী-নির্দিষ্ট কন্টেন্টের জন্য, private ব্যবহার করুন বা ক্যাশ এড়িয়ে চলুন।
TryQuickToolBox দিয়ে আপনার ওয়ার্কফ্লো দ্রুত করুন
আপনার সাইটের পারফরম্যান্স অপ্টিমাইজ করার সময়, আপনার ছবি বা PDF কম্প্রেস করার প্রয়োজন হতে পারে। আমাদের Image Compressor ব্যবহার করে গুণমান না হারিয়ে ছবির আকার কমিয়ে আনুন, আপনার Nginx ক্যাশিং কৌশলের পরিপূরক হিসেবে।