HTML5 ফাইলসিস্টেম API ব্যবহার করে একটি সম্পূর্ণ পৃষ্ঠা অফলাইনে নেওয়া

আসুন এটির মুখোমুখি হই, AppCache বিরক্তিকর এবং সমস্যা রয়েছে [ 1 , 2 , 3 ]৷ একটি বড় সীমাবদ্ধতা হল যে চাহিদার উপর গতিশীলভাবে সম্পদ ক্যাশে করা অসম্ভব। মূলত, এটি একটি অ্যাপ অফলাইনে নেওয়ার ক্ষেত্রে এটিকে সব বা কিছুই করে তোলে। হয় ম্যানিফেস্টের সবকিছু সামনে ক্যাশ করা হয়, বা কিছুই ক্যাশে করা হয় না।

HTML5 ফাইলসিস্টেম এপিআই অ্যাপক্যাশের ত্রুটিগুলির জন্য একটি আকর্ষণীয় সমাধান হয়ে উঠেছে। কেউ স্থানীয় (স্যান্ডবক্সড) ফাইল সিস্টেমে প্রোগ্রাম্যাটিকভাবে ফাইল এবং ফোল্ডার শ্রেণিবিন্যাস সঞ্চয় করতে পারে এবং পরবর্তীতে প্রয়োজনে পৃথক সংস্থান যোগ/আপডেট/মুছে ফেলতে পারে। আমার সহকর্মী, Boris Smus, এমনকি গেমের প্রসঙ্গে এই ধরনের অফলাইন ক্যাশিং পরিচালনা করার জন্য একটি চমৎকার লাইব্রেরি লিখেছেন। যে কোনো ধরনের ওয়েব অ্যাপের সাথে কাজ করার জন্য একই ধারণা এক্সট্রাপোলেট করা যেতে পারে।

crbug.com/89271 হল FileSystem API এর জন্য একটি গুরুত্বপূর্ণ ফিক্স যা আপেক্ষিক ফাইলসিস্টেম তৈরি করে: URL পাথ একটি মনোমুগ্ধকর মত কাজ করে।

উদাহরণস্বরূপ বলা যাক, আমি ফাইল সিস্টেমের রুট ফোল্ডারে ( fs.root ) index.html সংরক্ষণ করেছি, একটি img ফোল্ডার তৈরি করেছি এবং এতে "test.png" সংরক্ষণ করেছি। filesystem: এই দুটি ফাইলের URL হবে যথাক্রমে filesystem:http://example.com/temporary/index.html এবং filesystem:http://example.com/temporary/img/test.png । তারপর, যদি আমি একটি img.src এর জন্য "test.png" ব্যবহার করতে চাই, তাহলে আমাকে এর সম্পূর্ণ পরম পথ ব্যবহার করতে হবে: <img src="filesystem:http://example.com/temporary/img/test.png"> এর অর্থ হল সংশ্লিষ্ট ফাইলের filesystem: URL-এর দিকে নির্দেশ করতে index.html-এ সমস্ত আপেক্ষিক ইউআরএল পুনরায় লেখা। ভালো না! এখন, এই বাগ ফিক্সের সাথে, আমি ফাইলের আপেক্ষিক পথটি রাখতে পারি ( <img src="img/test.png"> ) কারণ তারা একটি ফাইল সিস্টেমের মূলে সঠিকভাবে সমাধান করবে।

এই বৈশিষ্ট্যটি একটি পৃষ্ঠা টেনে নামানো এবং অফলাইনে এর সমস্ত সংস্থান সংরক্ষণ করাকে তুচ্ছ করে তোলে, যখন এখনও অনলাইন সংস্করণের মতো একই ফোল্ডার কাঠামো সংরক্ষণ করে।

,

আসুন এটির মুখোমুখি হই, AppCache বিরক্তিকর এবং সমস্যা রয়েছে [ 1 , 2 , 3 ]৷ একটি বড় সীমাবদ্ধতা হল যে চাহিদার উপর গতিশীলভাবে সম্পদ ক্যাশে করা অসম্ভব। মূলত, এটি একটি অ্যাপ অফলাইনে নেওয়ার ক্ষেত্রে এটিকে সব বা কিছুই করে তোলে। হয় ম্যানিফেস্টের সবকিছু সামনে ক্যাশ করা হয়, বা কিছুই ক্যাশে করা হয় না।

HTML5 ফাইলসিস্টেম এপিআই অ্যাপক্যাশের ত্রুটিগুলির জন্য একটি আকর্ষণীয় সমাধান হয়ে উঠেছে। কেউ স্থানীয় (স্যান্ডবক্সড) ফাইল সিস্টেমে প্রোগ্রাম্যাটিকভাবে ফাইল এবং ফোল্ডার শ্রেণিবিন্যাস সঞ্চয় করতে পারে এবং পরবর্তীতে প্রয়োজনে পৃথক সংস্থান যোগ/আপডেট/মুছে ফেলতে পারে। আমার সহকর্মী, Boris Smus, এমনকি গেমের প্রসঙ্গে এই ধরনের অফলাইন ক্যাশিং পরিচালনা করার জন্য একটি চমৎকার লাইব্রেরি লিখেছেন। যে কোনো ধরনের ওয়েব অ্যাপের সাথে কাজ করার জন্য একই ধারণা এক্সট্রাপোলেট করা যেতে পারে।

crbug.com/89271 হল FileSystem API এর জন্য একটি গুরুত্বপূর্ণ ফিক্স যা আপেক্ষিক ফাইলসিস্টেম তৈরি করে: URL পাথ একটি মনোমুগ্ধকর মত কাজ করে।

উদাহরণস্বরূপ বলা যাক, আমি ফাইল সিস্টেমের রুট ফোল্ডারে ( fs.root ) index.html সংরক্ষণ করেছি, একটি img ফোল্ডার তৈরি করেছি এবং এতে "test.png" সংরক্ষণ করেছি। filesystem: এই দুটি ফাইলের URL হবে যথাক্রমে filesystem:http://example.com/temporary/index.html এবং filesystem:http://example.com/temporary/img/test.png । তারপর, যদি আমি একটি img.src এর জন্য "test.png" ব্যবহার করতে চাই, তাহলে আমাকে এর সম্পূর্ণ পরম পথ ব্যবহার করতে হবে: <img src="filesystem:http://example.com/temporary/img/test.png"> এর অর্থ হল সংশ্লিষ্ট ফাইলের filesystem: URL-এর দিকে নির্দেশ করতে index.html-এ সমস্ত আপেক্ষিক ইউআরএল পুনরায় লেখা। ভালো না! এখন, এই বাগ ফিক্সের সাথে, আমি ফাইলের আপেক্ষিক পথটি রাখতে পারি ( <img src="img/test.png"> ) কারণ তারা একটি ফাইল সিস্টেমের মূলে সঠিকভাবে সমাধান করবে।

এই বৈশিষ্ট্যটি একটি পৃষ্ঠা টেনে নামানো এবং অফলাইনে এর সমস্ত সংস্থান সংরক্ষণ করাকে তুচ্ছ করে তোলে, যখন এখনও অনলাইন সংস্করণের মতো একই ফোল্ডার কাঠামো সংরক্ষণ করে।