লিঙ্ক এবং স্ক্রিপ্ট ট্যাগগুলিতে সিএসএস এবং জাভাস্ক্রিপ্ট ইউআরএলগুলিতে "? V = 1" যুক্ত করা কী করে?

Question

আমি একটি এইচটিএমএল 5 বয়লারপ্লেট টেম্পলেটটি দেখেছি ( http://html5boilerplate.com/ থেকে ) এবং "?v=1"CSS এবং জাভাস্ক্রিপ্ট ফাইলগুলি উল্লেখ করার সময় URL গুলিতে ব্যবহার লক্ষ্য করেছি in

1. কি সংযোজন করে "?v=1"লিঙ্ক এবং স্ক্রিপ্ট ট্যাগ CSS এবং জাভাস্ক্রিপ্ট URL গুলিতে করেন?
2. সমস্ত জাভাস্ক্রিপ্ট ইউআরএলের "?v=1"(নীচের নমুনা থেকে উদাহরণ js/modernizr-1.5.min.js:) নেই। কেন এই কারণ হওয়ার কোনও কারণ আছে?

তাদের থেকে নমুনা index.html:

<!-- CSS : implied media="all" -->
<link rel="stylesheet" href="css/style.css?v=1">

<!-- For the less-enabled mobile browsers like Opera Mini -->
<link rel="stylesheet" media="handheld" href="css/handheld.css?v=1">

<!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
<script src="js/modernizr-1.5.min.js"></script>

<!------ Some lines removed ------>

<script src="js/plugins.js?v=1"></script>
<script src="js/script.js?v=1"></script>

<!--[if lt IE 7 ]>
  <script src="js/dd_belatedpng.js?v=1"></script>
<![endif]-->


<!-- yui profiler and profileviewer - remove for production -->
<script src="js/profiling/yahoo-profiling.min.js?v=1"></script>
<script src="js/profiling/config.js?v=1"></script>
<!-- end profiling code -->

Answer 1

এগুলি সাধারণত নিশ্চিত করা হয় যে ব্রাউজারটি নতুন সংস্করণটি পেয়ে যায় যখন সাইটটি একটি নতুন সংস্করণ সহ আপডেট হয়, যেমন আমাদের বিল্ড প্রক্রিয়াটির অংশ হিসাবে আমাদের এই জাতীয় কিছু থাকতে হবে:

/Resources/Combined.css?v=x.x.x.buildnumber

যেহেতু প্রতিটি নতুন কোড পুশের সাথে এটি পরিবর্তন হয়, ক্লায়েন্ট কেবল ক্যোরিস্ট্রিংয়ের কারণে একটি নতুন সংস্করণ দখল করতে বাধ্য হয়। উদাহরণস্বরূপ এই পৃষ্ঠাটি দেখুন (এই উত্তরের সময়ে):

<link ... href="http://sstatic.net/stackoverflow/all.css?v=c298c7f8233d">

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

এই উভয় পদ্ধতির সাহায্যে আপনি হাস্যকরভাবে দীর্ঘ কিছুতে ক্যাশে শিরোলেখ সেট করতে পারবেন, 20 বছর বলুন ... তবুও যখন এটি পরিবর্তিত হয়, আপনাকে সেই ক্যাশে শিরোনাম সম্পর্কে চিন্তা করতে হবে না, ব্রাউজারটি একটি পৃথক ক্যোয়ারস্ট্রিং দেখে এবং এটির হিসাবে বিবেচনা করে বিভিন্ন, নতুন ফাইল।

Comments

@ ফ্রি - গতকাল পাঠানো একটি ক্যাশে কন্ট্রোল শিরোনাম ক্লায়েন্টকে ফাইলটি আজ পরিবর্তিত (ক্লায়েন্ট এমনকি চেক করবে না) বলতে পারে না, একটি ইউআরএল পারে। আমি কি অনুপস্থিত সেখানে ব্যাখ্যা করতে পারি?

— নিক Craver

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

— নিক Craver

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

— নিক ক্র্যাভার

@ ফ্রি - 5 মিলিয়ন প্রতি মাসে 5 মিলিয়ন দর্শনার্থী , যেহেতু আমরা দিনে বহুবার নিযুক্ত করি, অনুরোধগুলি বহুগুণ বেশি । এইচটিএমএল পৃষ্ঠা-বোঝার ক্ষেত্রে আমরা প্রতিমাসে ১১০ মিলিয়নেরও বেশি কথা বলছি (এবং বাড়ছে ... আবার এটি কেবলমাত্র HTML পৃষ্ঠা লোড)। ক) হ্যাঁ, আরও অনেকগুলি বা আরও বিরতি, ক্যাশে সময় বনাম ক্লায়েন্টদের সঠিক বিষয়বস্তু থাকা এটি কোনওভাবেই বাণিজ্য-বন্ধ। এছাড়াও, খ) এর জন্য আপনার যুক্তি ত্রুটিযুক্ত, এইচটিএমএল ক্যাশে করা হয় না , তাই ক্যাশেড জেএসের সাথে ব্যবহার করা হয় যে আর কাজ করে না মানে কেবল ক্যাশেড ব্যবহারকারীরা ক্ষতিগ্রস্থ হন, তারা প্রতিরোধক নন।

— নিক ক্র্যাভার

@ জিএমএসএফ ভি কেবলমাত্র আমাদের জন্য "সংস্করণ" উপস্থাপন করে এটি একটি সম্পূর্ণ স্বেচ্ছাসেবী পছন্দ। যে কোনও মান কোয়েরি স্ট্রিং কাজ করবে, উদাহরণস্বরূপ এটি সহজেই হতে পারে? Jejdutogjesudo =

— নিক ক্র্যাভার

Answer 2

এটি নিশ্চিত করে যে আপনি সার্ভার থেকে সিএসএস বা জেএস ফাইলের সর্বশেষতম সংস্করণ পাচ্ছেন।

এবং পরে আপনি "?v=2"যদি নতুন সংস্করণ এবং আরও কিছু থাকে তবে সংযোজন করতে পারেন "?v=3", "?v=4"।

মনে রাখবেন যে আপনি যে কোনওটি ব্যবহার করতে পারেন querystring, উদাহরণস্বরূপ 'v' আবশ্যক নয়:

"?blah=1"পাশাপাশি কাজ করবে।

এবং

"?xyz=1002" কাজ করবে.

এবং এটি একটি সাধারণ কৌশল কারণ ব্রাউজারগুলি এখন জেএস এবং সিএসএস ফাইলগুলি আরও ভাল এবং আরও দীর্ঘায়িত করছে।

Answer 3

আপনি যখন স্থানীয় ওয়েব ফোল্ডারে ফাইলের কোন সংস্করণ বসে আছেন তা জানতে চাইলে হ্যাশ সমাধানটি দুর্দান্ত তবে সত্যই মানব পাঠযোগ্য নয়। সমাধানটি হ'ল date/timeআপনার সংস্করণটি স্ট্যাম্প করা যাতে আপনি এটি সহজেই আপনার সার্ভার ফাইলের সাথে তুলনা করতে পারেন।

উদাহরণস্বরূপ, যদি আপনার .js or .cssফাইলটি তারিখ হয় 2011-02-08 15:55:30(শেষ পরিবর্তন) তবে সংস্করণটির সমান হওয়া উচিত.js?v=20110208155530

যে কোনও ভাষাতে যে কোনও ফাইলের বৈশিষ্ট্যগুলি পড়া সহজ হওয়া উচিত। এএসপি.নেটে এটি সত্যিই সহজ ...

".js?v=" + File.GetLastWriteTime(HttpContext.Current.Request.PhysicalApplicationPath + filename).ToString("yyMMddHHHmmss");

কোজ এর প্রথমে সম্পত্তি এবং ফাংশনগুলিতে সুন্দরভাবে রিফ্যাক্টর করুন এবং আপনি যান go কোন অজুহাত.

শুভকামনা, আর্ট।

Comments

আপনি যদি কেবল এইচটিএমএল জেএসএস এবং সিএসএস দিয়ে নিজের ওয়েবসাইট তৈরি করছেন তবে কী হবে। তাহলে কীভাবে আমরা স্থিতিশীল সংস্থাগুলিতে সংস্করণটির নাম স্বয়ংক্রিয়ভাবে ইনজেক্ট করতে পারি?

— নিশানথ নায়ার

@ হুইজকিড 7747 দেরীতে জবাব, তবে নতুনদের জন্য, আপনি যে কোনও সাইট বিল্ডার / বিল্ড সিস্টেম ব্যবহার করছেন তার সংস্করণ হিসাবে আপনি যে সংস্করণটি ব্যবহার করতে পারবেন তা তারিখ পাওয়ার জন্য একটি উপায় থাকা উচিত, অন্যথায় যদি আপনি কোনও বিল্ডার ব্যবহার না করেন // বিল্ড সিস্টেম আপনার নিজের এটি লিখতে হবে।

— এন্টকে

Answer 4

জাভাস্ক্রিপ্ট ফাইলগুলি প্রায়শই ব্রাউজারের কাছ থেকে আপনি প্রত্যাশার চেয়ে অনেক বেশি সময় ধরে ক্যাশে হন।

আপনি যখন আপনার জেএস ফাইলের একটি নতুন সংস্করণ প্রকাশ করেন তখন প্রায়শই এটি অপ্রত্যাশিত আচরণের ফলে ঘটতে পারে।

সুতরাং, জাভাস্ক্রিপ্ট ফাইলের জন্য ইউআরএলে কোয়েরিস্ট্রিং প্যারামিটার যুক্ত করা সাধারণ অভ্যাস। এইভাবে, ব্রাউজার জাভাস্ক্রিপ্ট ফাইলটিকে v = 1 দিয়ে ক্যাশে করে। আপনি যখন আপনার জাভাস্ক্রিপ্ট ফাইলটির একটি নতুন সংস্করণ প্রকাশ করবেন আপনি url গুলিকে ভি = 2 এ পরিবর্তন করবেন এবং ব্রাউজারটি একটি নতুন অনুলিপি ডাউনলোড করতে বাধ্য হবে।

Comments

ঠিক কোন ব্রাউজারগুলি? এমনকি বেশিরভাগ স্পর্শকাতর আইই 5 এবং 6 টি ক্যাশে নিয়ন্ত্রণ শিরোনাম মানছিল।

— ফ্রি পরামর্শ

Answer 5

আপনার প্রশ্নের উত্তর দেওয়ার জন্য;

"? V = 1" এটি কেবল ব্রাউজারের ক্যাশে থেকে সিএসএস এবং জেএস ফাইলগুলির একটি নতুন কপি ডাউনলোড করতে বিচুস লিখিত হয়েছে।

আপনি যদি আপনার স্টাইলশিট বা জেএস ফাইলের শেষে এই ক্যোয়ারী স্ট্রিং প্যারামিটারটি উল্লেখ করেন তবে এটি ব্রাউজারকে একটি নতুন ফাইল ডাউনলোড করতে বাধ্য করে, যার কারণে আপনার ব্রাউজারে .css এবং .js ফাইলগুলিতে সাম্প্রতিক পরিবর্তনগুলি কার্যকর করা হয়েছে।

আপনি যদি এই সংস্করণটি ব্যবহার না করেন তবে সেই ফাইলগুলিতে সাম্প্রতিক পরিবর্তনগুলি দেখার জন্য আপনাকে পৃষ্ঠাটি রিফ্রেশের ক্যাশে সাফ করতে হবে।

এখানে এই নিবন্ধটি এখানে ব্যাখ্যা করা হয়েছে সিএসএস এবং জেএস ফাইলগুলির সংস্করণ তৈরি করতে এবং কীভাবে করে

Answer 6

নতুন প্রকাশের বিকাশ / পরীক্ষার সময়, ক্যাশে সমস্যা হতে পারে কারণ ব্রাউজার, সার্ভার এবং এমনকি কখনও কখনও 3 জি টেলকো (যদি আপনি মোবাইল স্থাপনা করেন) স্থির সামগ্রীটি (যেমন জেএস, সিএসএস, এইচটিএমএল, আইএমজি) ক্যাশে করবে। আপনি URL এ সংস্করণ নম্বর, এলোমেলো নম্বর বা টাইমস্ট্যাম্প যুক্ত করে এটি কাটিয়ে উঠতে পারেন যেমন: জেএসপি:<script src="js/excel.js?time=<%=new java.util.Date()%>"></script>

আপনি খাঁটি এইচটিএমএল (সার্ভার পৃষ্ঠাগুলি জেএসপি, এএসপি, পিএইচপি পরিবর্তে) চালিয়ে যাওয়ার ক্ষেত্রে সার্ভার আপনাকে সাহায্য করবে না। ব্রাউজারে, লিঙ্কগুলি জেএস চালুর আগে লোড হয়, অতএব আপনাকে লিঙ্কগুলি সরিয়ে জেএস দিয়ে এগুলি লোড করতে হবে।

// front end cache bust
var cacheBust = ['js/StrUtil.js', 'js/protos.common.js', 'js/conf.js', 'bootstrap_ECP/js/init.js'];   
for (i=0; i < cacheBust.length; i++){
     var el = document.createElement('script');
     el.src = cacheBust[i]+"?v=" + Math.random();
     document.getElementsByTagName('head')[0].appendChild(el);
}

Answer 7

আপনি আগে পড়তে পারেন, ?v=1 আপনার ব্রাউজারটি ফাইলের 1 সংস্করণ পাবে নিশ্চিত করে। যখন আপনার একটি নতুন সংস্করণ থাকবে, আপনাকে কেবল একটি আলাদা সংস্করণ নম্বর সংযোজন করতে হবে এবং ব্রাউজারটি পুরানো সংস্করণটি ভুলে যাবে এবং নতুনটি লোড করবে।

একটি গল্প প্লাগইন রয়েছে যা বিল্ড পর্বের সময় আপনার ফাইলগুলির সংস্করণটির যত্ন নেয়, সুতরাং আপনাকে এটি ম্যানুয়ালি করতে হবে না। এটি সুবিধাজনক এবং আপনি সহজেই এটি আপনার বিল্ডিং প্রক্রিয়াতে সংহত করতে পারেন। লিঙ্কটি এখানে: গুল্প-এনেটেট করুন

Answer 8

অন্যদের দ্বারা উল্লিখিত হিসাবে, এটি ফ্রন্ট এন্ড ক্যাশে বুস্টিংয়ের জন্য ব্যবহৃত হয়। এটি বাস্তবায়নের জন্য, আমি ব্যক্তিগতভাবে গ্রান্ট-ক্যাশে-বুস্ট এনপিএম প্যাকেজটি দরকারী বলে মনে করি।

Comments

এই লিঙ্কটি যদি প্রশ্নের উত্তর দিতে পারে তবে লিঙ্কটি কেবল উত্তরগুলি স্ট্যাক ওভারফ্লোতে নিরুৎসাহিত করা হয়, আপনি লিঙ্কটির গুরুত্বপূর্ণ অংশগুলি গ্রহণ করে এবং আপনার উত্তরে রেখে এই উত্তরটি উন্নত করতে পারেন, এটি নিশ্চিত করে যদি আপনার উত্তরটি এখনও উত্তর হয় তবে লিঙ্কটি পরিবর্তন হয়ে যায় বা সরানো হয়েছে :)

— হোয়াইটপয়েন্ট