অব্যবহৃত সিএসএস ইস্যু সম্পর্কে কীভাবে যাবেন


10

আমি একটি ব্লগে কিছু স্পিডস্টেট চালাচ্ছি এবং আমি সর্বদা অব্যবহৃত সিএসএস সম্পর্কে অভিযোগ পাই। তবে এটি সিএসএস নয় যা আমি কখনই ব্যবহার করি না, এটি নির্দিষ্ট পৃষ্ঠায় ব্যবহৃত হয় না।

এখন আমি কাঠামোগত উপায়ে কাজ করি, তবে ফাইলটিতে এখনও কিছু সিএসএস থাকতে হবে যা ব্যবহার করা হবে না, কারণ আপনার অন্য পৃষ্ঠায় এটি দরকার need

আমি মনে করি না যে বিভিন্ন পৃষ্ঠায় বিভিন্ন সিএসএস ফাইলগুলি ব্যবহার করার উপায়, আমি মনে করি আপনি কেবল একটি বড় ফাইল তৈরি করতে চেয়ে অনেক ভালো আছেন যা ক্যাশে যেতে পারে।

এটির সাথে ডিল করার একটি দুর্দান্ত উপায় এখনই রয়েছে বা আপনি কেবল এটির সাথে আঁকড়ে থাকেন।

উত্তর:


7

আপনার দৃser় প্রতিবাদ যে আপনি একটি, আরও বড় সিএসএস ফাইল দিয়ে ভাল। জিজেপ করা হলে এটি সম্ভবত কয়েক কেবি হবে এবং এটি ক্যাশে করা উচিত, সুতরাং বিশাল ওভারহেড নয়। যদিও চেক করার মতো কয়েকটি জিনিস রয়েছে।

কিছু সিএসএস যদি কেবল কোনও পৃষ্ঠায় ব্যবহার করা হয় তবে কিছু স্টাইল ট্যাগে পৃষ্ঠাটিতে সিএসএস স্থাপন করা ভাল। (দ্রষ্টব্য: এটি জিনিসগুলি বজায় রাখা কঠিন করে তুলতে পারে, বিশেষত আপনি যখন পরে অন্য কোথাও অনুরূপ স্টাইল ব্যবহার করার সিদ্ধান্ত নেন decide)

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

আপনার সিএসএস ভাল-অনুকূলিত হয়েছে তা নিশ্চিত করুন। যেখানে সম্ভব বংশোদ্ভূত নির্বাচকদের এড়িয়ে চলুন। যদি কোনও নির্বাচকের ডান হাতটি খুব জেনেরিক হয় তবে এটি রেন্ডারিং সময়টি ধীর করতে পারে। উদাহরণস্বরূপ .class div {}কিছুটা ধীর হতে হবে কারণ ব্রাউজারটিকে <div>পৃষ্ঠার প্রতিটি উপাদান যাচাই করতে হবে , তারপরে ক্লাসের সাথে কোনও উপাদান (বা না) খুঁজে পেতে ডম গাছটি খুব উপরে দেখবে।


2
অপ্টিমাইজ করতে আমি csslint.net এর
টবি

5

আমি মনে করি এটি আপনি যে দ্রুতগতিতে ব্যবহার করছেন তা হ'ল এটি পুরো সাইটের দিকে নজর দেয় না এবং কোন সিএসএস কখনই ব্যবহার হয় না তা দেখুন। যদি আপনি এমন কোনও সরঞ্জাম খুঁজে পান যা করতে পারে তবে আমাদের জানান!

আমি মনে করি আপনি কেবল একটি বড় ফাইল তৈরি করা থেকে অনেক ভাল যা ক্যাশে যেতে পারে।

হ্যাঁ, এটি অর্থবোধ করে, যদি না এমন পৃষ্ঠাগুলির সেট থাকে যেখানে অতিরিক্ত বিএসএসের প্রয়োজন হয় যার ক্ষেত্রে আপনি এটিতে অন্তর্ভুক্ত করতে পারেন।


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

মুদ্রণের জন্য সিএসএস যে কোনও পৃষ্ঠা ব্যবহার করতে পারে, সুতরাং আপনার ক্ষেত্রে এটি প্রয়োজন।
পলমোরিস

@ সাইফবেচন আপনার যদি আলাদা সিএসএসে প্রিন্ট শৈলী থাকে তবে আপনি সম্পূর্ণ ফাইলটি লক্ষ্যবস্তু করতে পারেন media="print"- কিছু ব্রাউজার আপনার পক্ষে পৃষ্ঠাটি প্রিন্ট / প্রাকদর্শন করার চেষ্টা না করা পর্যন্ত এটির জন্য অনুরোধ জারি করবে না।
জাফ - বেন ডুগুইড

1

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

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


+1 ধন্যবাদ আমি এটি খতিয়ে দেখব। আমি সিএসএস লিন্টও পরীক্ষা করে দেখেছি এবং আপনি যা বলছেন তা সত্য হতে পারে। প্রচুর প্রস্তাবগুলি সম্পূর্ণ ওভারকিল।
সাইফ বেকহান

1

এর সাথে মোকাবিলা করার জন্য আমি কল্পনা করতে পারি সবচেয়ে অপ্টিমাইজড এবং স্কেলেবল উপায়:

  1. "গ্লোবাল স্কোপ" (যেমন সাইটের ডিজাইন, গ্লোবাল ক্লাস, লাইব্রেরি, প্লাগইন ইত্যাদি ...) সম্পর্কিত প্রতিটি কিছুর জন্য একটি প্রধান সিএসএস ফাইল তৈরি করা ।

  2. প্রতি পৃষ্ঠায় একটি অনন্য সিএসএস ফাইলযুক্ত একটি ফোল্ডার জড়িত একটি সিস্টেম তৈরি করা (কেবলমাত্র প্রয়োজন হলে)। এই ফাইলগুলির সাথে লিঙ্ক করা পৃষ্ঠার মতোই ফাইলের নাম থাকতে পারে যাতে আপনি প্রতিটি পৃষ্ঠায় একটি সার্ভার সাইড স্ক্রিপ্ট চালাতে পারেন যা সেই ফোল্ডারে কোনও সিএসএস ফাইল সন্ধান করে এবং যদি সেখানে থাকে তবে পৃষ্ঠাটি যুক্ত করতে পারেন।

  3. হতে পারে, ব্রাউজার নির্দিষ্ট স্টাফের জন্য বিভিন্ন সিএসএস ফাইল তৈরি করা যা আপনি কেবল তখন লোড করেন যখন দর্শকের আপেক্ষিক ব্রাউজার থাকে।

এটি করে, আপনি আপনার সিএসএসকে আলাদা করার একটি দৃ and় এবং অনুকূলিতকরণের উপায়টি শেষ করবেন। হ্যাঁ মূল ফাইলটিতে এখনও অব্যবহৃত নিয়ম থাকবে তবে তারা সেখানে যুক্তিযুক্ত দৃষ্টিতে থাকবে বলে মনে করা হচ্ছে।

এছাড়াও মনে রাখবেন যে সিএসএস ফাইলগুলির এই 3 টি "স্তর" একক সিএসএস ফাইল হিসাবে ক্যাশে হবে।

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