কীভাবে ক্লায়েন্টের পক্ষ থেকে ফ্লাশ সিএসএস ক্যাশে জোর করবেন?

Question

মনে করুন যে আমরা মডিউল (টেমপ্লেট, লেআউট, সিএসএস) এর জন্য প্রচুর কার্যকারিতা পরিবর্তন করেছি এবং আমরা এই পরিবর্তনগুলি প্রযোজনা সাইটে স্থানান্তরিত করতে যাচ্ছি, তবে প্রচুর গ্রাহক তাদের ব্রাউজারগুলিতে সিএসএসকে ক্যাশে করেছেন। সুতরাং এখানে একটি প্রশ্ন। কীভাবে ফ্লাশ ক্লায়েন্টের সিএসএস ক্যাশে জোর করবেন এবং ফাইলের নামকরণ ( styles.css-> styles-v2.css) এড়ান । একটি যৌক্তিক উপায় আছে তবে এটি ম্যাজেন্টোতে কাজ করে না, কারণ এটি বিদ্যমান ফাইলটি পরীক্ষা করে (এই পদ্ধতিটি জেএস ফাইলগুলির জন্য যেভাবে কাজ করে) নীচে দেখুন:

<action method="addCss">
    <stylesheet>css/styles.css?1</stylesheet>
</action>  

কোন ধারনা?

Answer 1

এটির সাথে মোকাবিলা করার একটি উপায় হ'ল সিএসএসের মার্জ করা সক্ষম করে। তারপরে আপনি কেবল ক্যাশে সাফ করতে পারেন এবং একটি নতুন ফাইলের নামের সাথে একটি নতুন মার্জ করা ফাইল তৈরি করা হবে।

System -> Configuration -> Developer -> CSS settings -> Merge CSS Files

যতদূর আমি জানি, মার্জড সিএসএস ফাইলের হ্যাশ কোডটি একই রকম থাকে এমনকি অন্তর্নিহিত ফাইলগুলি পরিবর্তিত হলেও - কেবল যদি নতুন ফাইলগুলি মার্জ করা ফাইলগুলির সেটে যোগ করা হয় তবে হ্যাশ পরিবর্তন হয়। - @ অ্যালেক্স

এর সাথে ডিল করার আরেকটি উপায় হ'ল বিন্যাস.এক্সএমএল ব্যবহার না করে,

এগুলিকে আপনার মধ্যে রাখুন page/html/head.phtml

অথবা একটি ব্লক তৈরি করুন যাতে <style>সংস্করণ নম্বর সহ একটি ট্যাগ রয়েছে এবং এটি আপনার মাথার এক্সএমএলে রেখে দিন যাতে আপনি এটি কেবলমাত্র নির্দিষ্ট পৃষ্ঠায় লোড করতে পারেন এবং এখনও এক্সএমএল লেআউটগুলি ব্যবহার করে আটকে থাকতে পারেন।

Comments

যতদূর আমি জানি, মার্জড সিএসএস ফাইলের হ্যাশ কোডটি একই রকম থাকে এমনকি অন্তর্নিহিত ফাইলগুলি পরিবর্তিত হলেও - কেবল যদি নতুন ফাইলগুলি মার্জ করা ফাইলগুলির সেটে যোগ করা হয় তবে হ্যাশ পরিবর্তন হয়।

— অ্যালেক্স

@ অ্যালেক্স এটি জানত না, তা বোঝা যায়।

— রিক কুইপার্স

আমি সম্প্রতি এটির দিকে নজর দিইনি, তবে অতীতে সিএসএস / জেএসের সংকলনটি যদি আপনি বিভিন্ন পৃষ্ঠায় বিভিন্ন সিএসএস / জেএস লোড করেন তবে আপনার সাইটে আসলে অতিরিক্ত 'ওজন' যুক্ত হবে বলে মনে হচ্ছে। এটি স্ক্রিপ্টগুলির অনন্য সেট প্রতি পৃথক সংকলিত সংস্করণ তৈরি করেছে। এর অর্থ হ'ল বড় ফাইলগুলি সংকলিত হয় মূলত একাধিকবার ডাউনলোড করা হয়।

— পিটার ও'ক্যালাহান

@ ক্যাগস - হ্যাঁ, মূলত এই শর্তগুলির অধীনে, সমস্ত সিএসএস / জেএস ফাইলগুলিকে একবার ডাউনলোড করার অনুমতি দেওয়া এবং মঞ্জুরি দেওয়া একমাত্র গতির বর্ধন যা কাজ করে।

— ফায়াস্কো ল্যাবস

এটি মাঝেমধ্যে কমপক্ষে আমার জন্য Magento 1.9.2.1 এ সিএসএস আচরণ পরিবর্তন করতে পারে

— গুজ

Answer 2

আপনি ওপেনসোর্স মডিউল Aoe_JsCssTstamp ব্যবহার করতে পারেন যা মার্জ হওয়া CSS ফাইলগুলিতে টাইমস্ট্যাম্পের তথ্য যুক্ত করে। প্লেইন (আন-মার্জ) সিএসএস ফাইলগুলির টাইমস্ট্যাম্পগুলি এখনও সমর্থিত নয় তবে এটি কার্যকর করা সহজ হবে।

Answer 3

গিথুবটিতে একটি বিনামূল্যে এক্সটেনশন রয়েছে 'ম্যাজেন্টো ক্যাশেবাস্টার' যা ঠিক এটি করে। এটা আবার

https://github.com/gknoppe-guidance/magento-cachebuster

মডিউলটি স্বয়ংক্রিয়ভাবে> স্থিতিশীল ফাইলগুলির জন্য ম্যাজেন্টো দ্বারা নির্মিত ইউআরআই ফাইলটির নামের সাথে ফাইলের টাইমস্ট্যাম্প যুক্ত করে পরিবর্তন করে ক্যাশেস্টাস্টিং সরবরাহ করে:

পূর্বে: http://www.example.com/js/varien/js.js পরে: http://www.example.com/js/varien/js.1324429472.js

Comments

এই মডিউলটি টাইমস্ট্যাম্পগুলি যুক্ত করার জন্য প্রতিটি প্রতিক্রিয়াটির জন্য এইচটিএমএলকে বিশ্লেষণ করে, যা সম্ভবত কার্য সম্পাদনাকে আঘাত করতে পারে। github.com/fbrnc/Aoe_JsCssTstamp আরও পারফরম্যান্ট উপায়ে একই কাজ করে তবে এটি সম্পাদন করার জন্য ডিজাইনের প্যাকেজ মডেলটি পুনরায় লিখতে হবে, যখন ক্যাশেবাস্টার কেবলমাত্র একটি পর্যবেক্ষক ব্যবহার করে।

— ফ্যাবিয়ান শেমংলার

Answer 4

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

Comments

ফুমান স্পিডস্টার আমার বড় ভোট পেয়েছে

— বোবাদেভ

Answer 5

আমি সিএসএস ফাইলগুলির জন্য একটি ক্যাশে বাস্টার প্রয়োগ করেছি। আমার অনুমানের সেরা উপায়টি হ'ল Mage_Page_Block_Html_Head প্রসারিত করা এবং নীচে ফাংশনটি চালিয়ে যাওয়া এবং আপনার পছন্দসই পরিবর্তনগুলির সাথে $ স্কিন আইটেম অ্যারে আপডেট করা ।

protected function &_prepareStaticAndSkinElements($format, array $staticItems, array $skinItems, $mergeCallback = null)
{
    $designPackage = Mage::getDesign();
    //$skinItems: contains all css
    foreach ($skinItems as $params => $rows) {
        foreach ($rows as $key=>$name) {
            $file = $designPackage->getFilename($name, array('_type' => 'skin'));
            $skinItems[$params][$key] = $name . "?fmt=" . filemtime($file);
        }
    }
    return parent::_prepareStaticAndSkinElements($format, $staticItems, $skinItems, $mergeCallback);

}

এখান থেকে অনুপ্রেরণা পেয়েছি। উৎস

Comments

এটি কাজ করবে না, ত্বক ফাইলগুলি সর্বদা বেস / ডিফল্ট হয়ে যাবে কারণ ফাইলের নাম সংযুক্ত ক্যোয়ারী স্ট্রিংয়ের সাথে পাওয়া যাবে না।

— ব্লুসি

আপনার মন্তব্যগুলি "ফাইলের নাম সংযুক্ত ক্যোয়ারী স্ট্রিংয়ের সাথে পাওয়া যাবে না" যা আমরা চাই তা ঠিক করে এবং এটি যা ক্যাশে আবদ্ধ করবে এবং ক্যাশে সার্ভারকে একটি নতুন কপি আনতে বাধ্য করবে।

— আহাদ আলী

না, এটি মোটেই কার্যকর হয় না। আপনি $ স্কিনআইটেমস অ্যারেতে উপাদানগুলির মানগুলি পরিবর্তন করছেন এবং তারপরে পিতামাতাকে _প্রেপারস্ট্যাটিকঅ্যান্ডস্কিনএলিমেন্টস () পদ্ধতিতে পাঠিয়ে দিচ্ছেন। এই প্যারেন্ট পদ্ধতিটি প্রতিটি পরিবর্তিত আইটেমে ম্যাজ :: getDesign () -> getSkinUrl () কল করবে যা সর্বদা বেস / ডিফল্টে ফ্যালব্যাক করবে কারণ এটি ফাইল সিস্টেমে সংযুক্ত ফাইলগুলি fmt = xxx সহ সনাক্ত করতে পারে না?

— ব্লুসি

তার বাস্তবায়ন সম্পর্কে নিশ্চিত নন, তবে নীচে উত্সাহিত অনুপ্রেরণা অবশ্যই আপনার ঠিক মতো কাজ করবে, github.com/mklooss/Loewenstark_Head

— গুজ

Answer 6

একটি সহজ কিন্তু জটিল কাজ রয়েছে যার জন্য কোনও প্লাগইন প্রয়োজন হয় না এবং কেবল ম্যাগেন্টো সক্ষমতাতে অন্তর্নির্মিত ব্যবহারগুলি ব্যবহারের প্রয়োজন হয় - দরকারী যদি আপনার কেবলমাত্র কোনও কোড ইনস্টল করার ঝুঁকি না দেখিয়ে কোনও বিদ্যমান সাইটে তাড়াতাড়ি এটি করতে হয় তবে দরকারী।

ধারণাটি হ'ল আপনি মার্শেড সিএসএস সিস্টেমটি ক্যাশে বুস্টিং ফাইলের নাম তৈরি করতে ব্যবহার করতে পারেন।

মার্জ হওয়া সিএসএস ফাইলের নাম যেমন একত্রে একত্রিত হয়ে গেছে এমন সমস্ত ফাইলের একটি হ্যাশ হিসাবে আপনি কেবল কোনও নামের জন্য একটি তারিখ স্ট্যাম্পের সাথে থিমের সাথে একটি অতিরিক্ত ফাঁকা সিএসএস ফাইল যুক্ত করেন।

তাই:

1. কনফিগারেশন> উন্নত> বিকাশকারী সিএসএস ফাইলগুলিকে চালু করুন
2. আপনার থিম বিন্যাসে সন্ধান করুন যেখানে আপনি মাথায় সিএসএস ফাইল যুক্ত করেছেন (সাধারণত পেজ.এক্সএমএল) এবং একটি অতিরিক্ত স্টাইলশিট ফাইল যুক্ত করুন, নামটি যতক্ষণ না অনন্য হিসাবে আপনি চান এমন কোনও কিছুকে কল করুন যেমন <action method="addCss"><stylesheet>css/cachebust_091014.css</stylesheet></action>
3. আপনার ত্বকে সিএসএস ফোল্ডারে সেই নামটি দিয়ে একটি নতুন সিএসএস ফাইল তৈরি করুন, ফাইলের বিষয়বস্তুর জন্য আমি কেবল একটি মন্তব্য রেখেছি ফাইলটি কী জন্য তা

এখন সেই লাইভটি চাপুন এবং ম্যাজেন্টো ক্যাশে ফ্লাশ করুন, মার্জ করা CSS ফাইলটির এখন আলাদা নাম থাকবে এবং আপনার ক্যাশেগুলি ফাঁস হয়ে যাবে!

প্রত্যেকবার যেমন ফাইলের নামটি পরিবর্তন করতে আপনার প্রয়োজন ক্যাশে আবদ্ধ করতে চান এটি অসুবিধাজনক, তবে এটির জন্য ম্যাজেন্টো ক্ষমতাগুলি অন্তর্নির্মিত ব্যতীত অন্য কিছুই দরকার নেই, যদি আপনি নিজেকে আটকে যান এবং দ্রুত সমাধানের প্রয়োজন হয় তবে এটি কার্যকর!

Answer 7

=> এই কোডটি ব্যবহার করার পরিবর্তে:

<action method="addCss">
    <stylesheet>css/styles.css?1</stylesheet>
</action>

=> এই কোডটি ব্যবহার করার চেষ্টা করুন:

<reference name="head">
    <block type="core/text" name="foocss">
        <action method="setText">
            <css><![CDATA[<link rel="stylesheet" type="text/css" href="foo.css?1" media="all" />]]></css>
        </action>
    </block>
</reference>

তবে এটি খুব সুন্দর নয় ...

Comments

আকর্ষণীয় ধারণা :)

— নিক

স্বল্পমেয়াদী পরীক্ষার জন্য এটি একটি দুর্দান্ত ধারণা।

— জে এল-কাক

Answer 8

আমি এমন একটি মডিউল খুঁজে পেয়েছি যা এক্সএমএল লেআউটে সমস্ত সিএসএস এবং জেএস এর শেষে কোয়েরি স্ট্রিং যুক্ত করবে। ক্যোয়ারী স্ট্রিং অ্যাডমিন থেকে কনফিগারযোগ্য।

https://github.com/mklooss/Loewenstark_Head

মূল ধারণাটি _prepareStaticAndSkinElementsনীচে দেখানো মডিউলটিতে করা কোনও ক্যোরি স্ট্রিং অন্তর্ভুক্ত করার জন্য ওভাররাইড করা।

protected function &_prepareStaticAndSkinElements($format, array $staticItems, array $skinItems, $mergeCallback = null)
{
    $version = Mage::getStoreConfig("design/head/meta_version_tag");
    $format = sprintf($format, "%s?v{$version}", "%s");
    return parent::_prepareStaticAndSkinElements($format, $staticItems, $skinItems, $mergeCallback);
}

Answer 9

যদি আমি আপনার প্রশ্নের প্রস্তাবিত সমাধানটি বুঝতে পারি তবে আপনি এটি করতে পারেন কোনও মূল ফাইলের সাথে সামান্য মোড দিয়ে ( আসলে মূল ফাইলটি সম্পাদনা করবেন না ):

পুরোনো যাদুকর / পৃষ্ঠা / ব্লক / html / Head.php

1982 এর লাইনে? V = 1 এর মতো কিছু যুক্ত করুন যাতে সমস্ত CSS ফাইল এতে যুক্ত হয়:

$html .= $this->_prepareStaticAndSkinElements('<link rel="stylesheet" type="text/css" href="%s?v=1"%s />' . "\n",

Answer 10

আমি মনে করি ফুমান স্পিডস্টার অ্যাডভান্সড ( http://www.magentocommerce.com/magento-connect/fooman-speedsteradvanced-4030.html ) সমাধান হতে পারে:

"জাভাস্ক্রিপ্ট / সিএসএস ফাইল আপডেট করা হলে স্বয়ংক্রিয় সংস্করণ সহ একবার সম্পূর্ণ স্বয়ংক্রিয়ভাবে ইনস্টল করা"

Answer 11

আমি এটির জন্য একটি ফ্রি মডিউল তৈরি করেছি:

http://www.magentocommerce.com/magento-connect/frontend-flush-2048.html

অনুগ্রহ করে এটি যদি কাজ করে না তবে দয়া করে আমাকে জানান তবে আমি এটি তৈরি করেছি যাতে সংযুক্ত জেএসএস এবং সিএসএস ফাইলগুলির একটি পৃথক হ্যাশ থাকে যদি কনটেইনটেড ফাইলগুলির একটিতে সামগ্রী পরিবর্তন হয়ে থাকে। ডিফল্টরূপে ম্যাজেন্টো কেবলমাত্র সম্মিলিত ফাইলের হ্যাশ পরিবর্তন করতে পারে যদি অন্তর্ভুক্ত ফাইলগুলির মধ্যে একটির ফাইলের নাম পরিবর্তিত হয়।

হালনাগাদ

আপনারা যারা এটি বিশ্বাস করেন তাদের জন্য আমি একটি নিখরচায় এবং সাধারণ মিনিফাইড মডিউলও তৈরি করেছি।

http://www.magentocommerce.com/magento-connect/minify-7771.html

Comments

এই মডিউলটি কাজ করছে না ...

— এসআইবিআই এস

Answer 12

ফ্যাব্রিজিও ব্র্যাঙ্কা দ্বারা তৈরি একটি দুর্দান্ত মডিউল রয়েছে যা আপনার আগ্রহী জিনিসটি ঠিক তাই করে It's এটি বলা হয় ফ্যাবরিজিও ব্রাঙ্কা AOE_JsCSST স্ট্যাম্প হয় । এর মানে কি? এটি সিএসএস এবং জেএস উভয় সংস্থানগুলিতে একটি টাইম স্ট্যাম্প যুক্ত করে। আপনি যখন সিএসএস / জেএস ক্যাশে ফ্লাশ করেন তখন টাইমস্ট্যাম্পগুলি পুনরায় তৈরি করা হয়।

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

Answer 13

শুধু পদ্ধতি সম্পাদনা করুন getCssJsHtml মধ্যে Mage_Page_Block_Html_Head পর CSS সম্পাদনা করুন কয়েকদিন এই মত একটি পংক্তি যোগ করুন এবং যে সব ... এটা কেবল কাজ করে

// static and skin css
        $html .= $this->_prepareStaticAndSkinElements('<link rel="stylesheet" type="text/css" href="%s?foo=WHAT_YOU_WANT_HERE"%s />' . "\n",
            empty($items['js_css']) ? [] : $items['js_css'],
            empty($items['skin_css']) ? [] : $items['skin_css'],
            $shouldMergeCss ? [Mage::getDesign(), 'getMergedCssUrl'] : null
        );

Answer 14

কয়েক বছর পরে এবং কোনও কার্যকর এক্সটেনশন খুঁজে পাওয়া যায় নি যা ফাইলগুলিকে একীভূত করবে না এবং সহজ, আমি নিজের তৈরি করেছি। মূল ধারণাটি হ'ল ক্যাশে ফ্লাশ করার পরে এটি টাইমস্ট্যাম্পটি আপডেট করবে। সুতরাং অন্য কথায় - যখন আপনি কিছু পরিবর্তন করেন css/js, কেবল ফ্লাশ ক্যাশে এবং টাইমস্ট্যাম্প আপডেট করা হবে।

উত্স কোড এখানে -> https://github.com/archonkulis/ANSolutions_CssJs টাইমস্ট্যাম্প

1.9+ সংস্করণে কাজ করে । যদিও পুরানো সংস্করণগুলি সম্পর্কে নিশ্চিত নয় তবে সম্ভবত এটিরও কাজ করা উচিত।

Answer 15

আপনার থিমের একটি নতুন নাম (থিমভি 2) - ত্বক এবং অ্যাপ্লিকেশন / ডিজাইন উভয়ই দিয়ে একটি অনুলিপি তৈরি করুন তারপরে অ্যাডমিনে নতুন থিমটি চয়ন করুন।

Comments

না, আপনি কখনই তা করেন না। সত্যিই এটি করার একটি খারাপ উপায়

— মারিয়াস

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

— ফিল লি

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

— ফ্যাবিয়ান ব্ল্যাচসমিড

আপনি কীভাবে মোতায়েন করবেন তা আমি জানি না, তবে প্যাকেজ / থিমের মান পরিবর্তন না করা বা ইনস্টলটির মান আপডেট করে এমন স্ক্রিপ্ট তৈরি না করা পর্যন্ত আমাকে পুরাতন থিম ফোল্ডারটি রাখতে হবে। এছাড়াও, যদি আমার কাছে বিভিন্ন সময় বিভিন্ন থিম সেট করা থাকে তবে সেগুলি প্রভাবিত হতে পারে। অনেকগুলি ফাইলের নকল করা এখন পর্যন্ত সবচেয়ে সহজ উপায়। উদাহরণস্বরূপ এটি ইনস্টল করুন: github.com/jreinke/magento-suffix-static-files অনেক সহজ। আপনাকে যা করতে হবে তা হ'ল প্রতিটি মোতায়েনের পরে ব্যাকএন্ডে একটি নম্বর পরিবর্তন করতে হবে।

— মারিয়াস

এমন ভাবনাও না!

— রিন্টো জর্জ