একক বিশাল .css ফাইল বনাম একাধিক ছোট নির্দিষ্ট .css ফাইলগুলি? [বন্ধ]

Question

প্রায় প্রতিটি পৃষ্ঠায় ব্যবহার করা হবে এমন স্টাইল উপাদান রয়েছে এমন একক দানব .css ফাইল থাকার কি কোনও সুবিধা আছে?

আমি ভাবছি যে পরিচালনার স্বাচ্ছন্দ্যের জন্য, আমি কয়েকটি ফাইলের মধ্যে বিভিন্ন ধরণের সিএসএস টানতে চাই এবং আমার ফাইলের প্রতিটি ফাইল অন্তর্ভুক্ত করা <link />কি খারাপ?

আমি ভাবছি এটি আরও ভাল

1. positions.css
2. buttons.css
3. tables.css
4. copy.css

বনাম

1. site.css

আপনি কি অন্যভাবে কোনও উপায়ে এটির সাথে কোনও গ্যাটাচগুলি দেখেছেন?

Comments

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

— ফ্রান্সিসকো প্রেজেনসিয়া

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

— চেজ ফ্লোরেল

এটি যখনই CSS পরিবর্তিত হয় তখনই এটি চালানো হবে এবং তারপরে আপনাকে ফলাফলের CSS ফাইলটি অন্তর্ভুক্ত করতে হবে।

— ফ্রান্সিসকো প্রেজেনসিয়া

Answer 1

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

এসএসএস লিখতে এবং বজায় রাখা সহজ করার জন্য এসএএসএস এবং এলইএস এর ভেরিয়েবল, বাসা বাঁধার এবং অন্যান্য উপায়ে যুক্ত করার সুবিধা রয়েছে। উচ্চতর, অত্যন্ত প্রস্তাবিত। আমি ব্যক্তিগতভাবে এখন সাস (এসসিএসএস সিনট্যাক্স) ব্যবহার করি, তবে আগে খুব কম ব্যবহার করেছি। উভয়ই একই রকম উপকার সহ দুর্দান্ত। একবার আপনি একটি সংকলক সহ সিএসএস লিখেছেন, আপনি এটি না করেই সম্ভব না এমন সম্ভাবনা।

http://lesscss.org

http://sass-lang.com

আপনি যদি রুবির সাথে গোলযোগ করতে না চান তবে ম্যাকের জন্য এই কম সংকলকটি দুর্দান্ত:

http://incident57.com/less/

অথবা আপনি কোডকিট ব্যবহার করতে পারেন (একই লোক দ্বারা):

http://incident57.com/codekit/

উইনলিস হ'ল কম কমপ্লাই করার জন্য একটি উইন্ডোজ জিইউআই

http://winless.org/

Comments

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

— নোট

Answer 2

এটি একটি কঠিন উত্তর। উভয় বিকল্পের আমার মতে তাদের পক্ষে মতামত রয়েছে।

আমি ব্যক্তিগতভাবে একটি একক বিশাল সিএসএস ফাইলের মাধ্যমে পড়া পছন্দ করি না এবং এটি বজায় রাখা খুব কঠিন। অন্যদিকে, এটিকে বিভক্ত করার ফলে অতিরিক্ত http অনুরোধ দেখা দেয় যা সম্ভাব্য জিনিসগুলি ধীরে ধীরে কমিয়ে দিতে পারে।

আমার মতামত দুটি জিনিসের একটি হতে পারে।

1) আপনি যদি জানেন যে আপনার সিএসএস এটি তৈরির পরে কখনও পরিবর্তন হবে না, আমি বিকাশের পর্যায়ে একাধিক সিএসএস ফাইল তৈরি করতে পারি (পাঠযোগ্যতার জন্য), এবং তারপরে সরাসরি যাওয়ার আগে সেগুলি ম্যানুয়ালি একত্রিত করব (http অনুরোধগুলি হ্রাস করতে)

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

উভয় বিকল্পের সাহায্যে আমি ক্লায়েন্টের পক্ষে ক্যাচিংয়ের সুপারিশ করব যাতে আরও HTTP অনুরোধগুলি হ্রাস করা যায়।

সম্পাদনা করুন:
আমি এই ব্লগটি পেয়েছি যা দেখায় যে কীভাবে কোড ব্যতীত আর কিছুই রান আওয়ারে সিএসএসকে একত্রিত করতে হয়। একবার দেখে নেওয়া মূল্যবান (যদিও আমি এখনও এটি পরীক্ষা করেছি না)।

সম্পাদনা 2:
আমি আমার ডিজাইনের সময় পৃথক ফাইলগুলি ব্যবহার করে স্থির করেছি, এবং সংযোজন এবং একত্রিত করার জন্য একটি বিল্ড প্রক্রিয়া। এইভাবে আমার বিকাশকালে পৃথক (পরিচালনযোগ্য) সিএসএস এবং রানটাইমের সময় একটি সঠিক একঘেয়েমিযুক্ত মাইনিফাইড ফাইল থাকতে পারে। এবং আমার এখনও আমার স্ট্যাটিক ফাইল এবং কম সিস্টেম ওভারহেড রয়েছে কারণ আমি রানটাইমটিতে সংক্ষেপণ / মিনিফিকেশন করছি না।

দ্রষ্টব্য: আপনার ক্রেতাদের জন্য, আমি আপনার বিল্ড প্রক্রিয়াটির অংশ হিসাবে বান্ডিলারটি ব্যবহার করার পরামর্শ দিচ্ছি । আপনি নিজের আইডিই থেকে তৈরি করছেন বা বিল্ড স্ক্রিপ্ট থেকে, বান্ডলারটি অন্তর্ভুক্তের মাধ্যমে উইন্ডোজটিতে কার্যকর করা exeযেতে পারে বা ইতিমধ্যে নোড.জেএস চলছে এমন কোনও মেশিনে চালানো যেতে পারে

Comments

কম সংখ্যক এইচটিটিপি অনুরোধ ছাড়াও একক একক ফাইলটির কোনও সুবিধা আছে কি? আমার সিএসএস সময়ের সাথে সাথে পরিবর্তন হতে পারে তবে ব্যবহারকারীর সংখ্যা বেশ কম হবে, উচ্চ গতির সংযোগের মাধ্যমে বেশিরভাগ অ্যাক্সেস করা যায়। সুতরাং আমি মনে করি যে একাধিক ফাইলের সুবিধা হ'ল কম http অনুরোধের চেয়ে অনেক বেশি হবে ...

— নট

কম HTTP অনুরোধ কারণ হয়। দর্শকদের ধরে রাখা অগ্রাধিকার # 1, সুতরাং আপনার পৃষ্ঠাটি যদি ধীরে ধীরে লোড হয় তবে তাদের থাকার সম্ভাবনা কম। আপনার যদি একত্রিত করার ক্ষমতা থাকে (আমি দেখছি আপনি এসপ নেট ব্যবহার করছেন) তবে আমি এটি করার জন্য সুপারিশ করব। এটি উভয় বিশ্বের সেরা।

— চেজ ফ্লোরেল

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

— ইসলে আর্দভার্ক

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

— কোনও ফেরত পাওয়া যাবে না

এই উত্তরটি এখনই আপডেট করা হবে যে http2 কম অনুরোধের সুবিধা হ্রাস করবে।

— ডিডি।

Answer 3

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

Comments

@ র্যান্ডি সাইমন - তবে যদি আমরা সবসময় ftp- এ সরাসরি CSS সম্পাদনা করি।

— জিতেন্দ্র ব্যাস

আমি আপনার সেটআপটি জানি না, তবে এটি আমার কাছে ভাল ধারণা বলে মনে হয় না। তাদের ধাক্কা দেওয়ার আগে আপনার পরিবর্তনগুলি পরীক্ষা করা উচিত।

— রেন্ডি সাইমন

@ র্যান্ডিসিমন YUI কমপ্রেসার লিংকটি নষ্ট হয়েছে।

— সংস্কার

Answer 4

আপনি উভয় বিশ্বের চান।

আপনি একাধিক সিএসএস ফাইল চান কারণ আপনার বিচক্ষণতা নষ্ট করার মতো ভয়ঙ্কর জিনিস।

একই সময়ে, একটি একক, বড় ফাইল থাকা ভাল।

সমাধানটি এমন একটি পদ্ধতি রয়েছে যা একাধিক ফাইলকে একক ফাইলে একত্রিত করে।

একটি উদাহরণ কিছু

<link rel="stylesheet" type="text/css" href="allcss.php?files=positions.css,buttons.css,copy.css" />

তারপরে, allcss.php স্ক্রিপ্ট ফাইলগুলিকে একত্রিত করে এবং বিতরণ করে।

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

এটি আপনাকে উভয় বিশ্বের সেরা দেয়। জেএসের জন্যও দুর্দান্ত কাজ করে।

Comments

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

— চেজ ফ্লোরেল

@ChaseFlorell - আপনি অবশ্য কম্প্রেশন / এটি একবার minification এবং ক্যাশ না

— সিলার

@ সেলার, আমি জানি, সে কারণেই আমি আমার উত্তর পোস্ট করেছি। stackoverflow.com/a/2336332/124069

— চেজ Florell

Answer 5

আপনার পৃষ্ঠাগুলি লোডিং সময়ের জন্য কেবল একটি সিএসএস ফাইল থাকা ভাল, কারণ এটির চেয়ে কম HTTP অনুরোধ রয়েছে।

বেশ কয়েকটি ছোট সিএসএস ফাইল থাকা মানে বিকাশ সহজতর (কমপক্ষে, আমার কাছেও তাই মনে হয়: আপনার অ্যাপ্লিকেশনের প্রতি মডিউলে একটি করে সিএসএস ফাইল থাকা জিনিসগুলি সহজ করে তোলে) ।

সুতরাং, উভয় ক্ষেত্রেই ভাল কারণ রয়েছে ...

এমন একটি সমাধান যা আপনাকে উভয় ধারণার মধ্যে সবচেয়ে ভাল পেতে দেয়:

• বেশ কয়েকটি ছোট সিএসএস ফাইল ব্যবহার করে বিকাশ করতে
  • অর্থাত্ বিকাশ করা সহজ
• আপনার অ্যাপ্লিকেশনটির জন্য বিল্ড প্রক্রিয়া করার জন্য, সেই ফাইলগুলিকে একটিতে "সংযুক্ত" করে
  • বিটিডব্লু যে বিল্ড প্রক্রিয়াটি সেই বড় ফাইলটিকেও ছোট করতে পারে
  • স্পষ্টতই এর অর্থ হ'ল আপনার অ্যাপ্লিকেশনটিতে অবশ্যই কিছু কনফিগারেশন স্টাফ থাকতে হবে যা এটি "মাল্টি-ফাইলগুলি মোড" থেকে "মনো-ফাইল মোড" এ যাওয়ার অনুমতি দেয়।
• এবং ব্যবহার করতে, উত্পাদন, শুধুমাত্র বড় ফাইল
  • অর্থাত্ দ্রুত লোডিং পৃষ্ঠাগুলি

এমন কিছু সফ্টওয়্যার রয়েছে যা সিএসএস ফাইলগুলি রান-টাইমে সংমিশ্রিত করে, বিল্ড-টাইমে নয়; তবে রান-টাইমে এটি করা মানে আরও কিছুটা সিপিইউ খাওয়া (এবং বড় ফাইলটি প্রায়শই পুনরায় তৈরি না করার জন্য কিছুটা ক্যাচিং মেকানিজমের প্রয়োজন হয়)

Answer 6

Orতিহাসিকভাবে, একটি সিএসএস ফাইল রাখার অন্যতম প্রধান সুবিধা হ'ল এইচটিটিপি 1.1 ব্যবহার করার সময় গতির সুবিধা।

তবে, মার্চ ২০১ as অবধি ৮০% এর বেশি ব্রাউজার এইচটিটিপি 2 সমর্থন করে যা ব্রাউজারটিকে একসাথে একাধিক সংস্থান ডাউনলোড করার পাশাপাশি প্রাক-উদ্বিগ্নভাবে সংস্থানগুলি ধাক্কা দিতে সক্ষম করে। সমস্ত পৃষ্ঠার জন্য একটি সিএসএস ফাইল থাকা মানে প্রয়োজনীয় ফাইল আকারের চেয়ে বড়। যথাযথ ডিজাইনের সাহায্যে, কোড করা সহজ than

সেরা পারফরম্যান্সের জন্য এইচটিটিপি 2 এর আদর্শ নকশাটি হ'ল:

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

Comments

এটি হ'ল গৃহীত আধুনিক উত্তর আরই পারফরম্যান্স। কিছু অন্যান্য উত্তর পুরানো।

— স্পারউহক

যদি আপনি একটি এসপিএ (একক পৃষ্ঠার অ্যাপ্লিকেশন) তৈরি করে থাকেন তবে আমি যুক্তি দেব যে আপনার সিএসএস এবং জেএসএস দুটি সম্পূর্ণ ফাইলে তৈরি করা সবচেয়ে ভাল নকশা। "app.js" এবং "vendor.js" সমস্ত এইচটিএমএল, এবং শৈলীগুলি বিক্রেতার.জেএসগুলিতে জেএসকে ইনলাইন করতে সংকলিত হয়েছে যার অর্থ "বুটস্ট্র্যাপ সিএসএস এবং বুটস্ট্র্যাপ.জেএস" সবই বিক্রেতা-জেজে রয়েছে এবং এটি সোর্স ম্যাপের সাথে সংক্ষিপ্ত করে " vendor.min.js "। অ্যাপ্লিকেশনটির সাথে একই জিনিস, আপনি এখন থেকে এইচটিএমএল ব্যবহার করে জস ইনলাইন ট্রান্সপোর্টারটি এমনকি আপনার অ্যাপস এইচটিএমএল জেএস ফাইলে রয়েছে। আপনি সেগুলিকে একটি সিডিএনতে হোস্ট করতে পারেন এবং ব্রাউজারগুলি তাদের ক্যাশে করবে। এমনকি আপনি শৈলীতে এবং জেএসে চিত্রগুলি সংকলন করতে পারেন।

— রায়ান মন

Answer 7

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

এটি আইই এর সমস্ত সংস্করণের জন্য।

দেখুন রস Bruniges ব্লগ এবং দুটিই MSDN AddRule পৃষ্ঠা ।

Answer 8

একটি টিপিং পয়েন্ট রয়েছে যেখানে একাধিক সিএসএস ফাইল থাকা সুবিধাজনক।

1M + পৃষ্ঠাগুলি সহ একটি সাইট, যার গড় ব্যবহারকারী কেবল 5 টি বলেই সম্ভবত দেখতে পাবে, এর স্টাইলশীট প্রচুর পরিমাণে থাকতে পারে, তাই প্রচুর প্রাথমিক ডাউনলোডের মাধ্যমে পৃষ্ঠা লোডের জন্য একক অতিরিক্ত অনুরোধের ওভারহেড সংরক্ষণ করার চেষ্টাটি মিথ্যা অর্থনীতি।

যুক্তিটিকে চরম সীমাতে প্রসারিত করুন - এটি এমন পরামর্শ দেওয়ার মতো যে পুরো ওয়েবের জন্য একটি বড় স্টাইলশীট রক্ষণাবেক্ষণ করা উচিত। স্পষ্টত অযৌক্তিক।

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

Comments

হ্যাঁ. এই প্রশ্নটি সম্পর্কে আমি এখানে এসেছি। প্রত্যেকে উন্নয়ন বনাম উত্পাদনকে কেন্দ্র করে। অবশ্যই আপনার বিকাশের পরিবেশটি আপনার লাইভ সাইট থেকে আলাদা হতে পারে তবে লাইভ সাইটের পক্ষে কোনটি ভাল? সত্যিই কেউ এটিকে সম্বোধন করছে বলে মনে হয় না। টিপিং পয়েন্টটি কোথায় রয়েছে তা খুঁজে পাওয়ার কোনও সংস্থান সম্পর্কে আপনি কি জানেন?

— ডমিনিক পি

Answer 9

আমার কাছে সাধারণত মুষ্টিমেয় সিএসএস ফাইল থাকে:

• পুনরায় সেট এবং গ্লোবাল শৈলীর জন্য একটি "গ্লোবাল" সিএসএস ফাইল
• যৌক্তিকভাবে গোষ্ঠীযুক্ত পৃষ্ঠাগুলির জন্য "মডিউল" নির্দিষ্ট সিএসএস ফাইল (সম্ভবত একটি চেকআউট উইজার্ডের প্রতিটি পৃষ্ঠা বা কিছু)
• পৃষ্ঠায় ওভাররাইডের জন্য "পৃষ্ঠা" নির্দিষ্ট সিএসএস ফাইলগুলি (বা এটিকে পৃথক পৃষ্ঠায় একটি ব্লকে রেখে দিন)

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

Comments

এটি আমিই করি এবং এটি আমার জন্য ভালভাবে কাজ করে চলেছে। সর্বাধিক আপনি প্রতিটি পৃষ্ঠার জন্য 3 সিএসএস ফাইল পান যা বেশ যুক্তিসঙ্গত

— রিকার্ডো নুনস

Answer 10

আমি একাধিক সিএসএস ফাইল পছন্দ করি। আপনার ইচ্ছামত "স্কিনগুলি" ভিতরে এবং আউট বদল করা সহজ। এক একাত্ম ফাইলের সমস্যা হ'ল এটি নিয়ন্ত্রণের বাইরে চলে যেতে পারে এবং পরিচালনা করা শক্ত। আপনি যদি নীল ব্যাকগ্রাউন্ড চান তবে বাটনগুলি পরিবর্তন করতে চান না? আপনার ব্যাকগ্রাউন্ড ফাইলটি কেবল পরিবর্তন করুন। প্রভৃতি

Comments

সমস্যাটি হ'ল এটি একটি বিকাশকারীদের দৃষ্টিতে যথেষ্ট স্বার্থপর। একবার হয়ে গেলে, আপনাকে খুব কমই ফিরে যেতে হবে, তবে আপনার দর্শকদের অপ্রয়োজনীয় CSS ফাইলগুলি লোড করার জন্য পৃষ্ঠাগুলির জন্য অপেক্ষা করতে হবে। (একই কথা আমার মতে জাভাস্ক্রিপ্টের জন্য যায়)

— চেজ ফ্লোরেল

@ রকিন: আমার ক্যাশে সাফ করার পরে আমার ৫-সিএসএস-ফাইল সাইটগুলির মধ্যে একটিতে চেক করতে গিয়ে আমি আবিষ্কার করেছি যে সমস্ত সিএসএস লোড করতে মোট সময় লাগল এটি সেকেন্ডের দশম এর চেয়ে কম ছিল। লোকেরা যদি এতক্ষণ অপেক্ষা করতে না পারে তবে আমি মনে করি তাদের আরও রিতালিন বা কিছু দরকার। এর থেকেও বড় সমস্যাটি হ'ল ডাবলিক্লিক ইত্যাদির মতো বিজ্ঞাপন সাইটগুলিতে কলব্যাকস, যা গত সপ্তাহের মধ্যে এই একই সাইটে প্রত্যক্ষিত হিসাবে বিশাল বিলম্বের কারণ হতে পারে।

— রোবস্তো

সাইটের গতি পরীক্ষা করার জন্য দুর্দান্ত সরঞ্জাম হ'ল ওয়াইস্লো এর সাথে একযোগে ফায়ারব্যাগ। এটি আপনাকে আপনার সাইটের গতির একটি সঠিক উপস্থাপনা দেবে।

— চেজ ফ্লোরেল

Answer 11

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

Answer 12

এখানে সেরা উপায়:

1. সমস্ত ভাগ করা কোড সহ একটি সাধারণ সিএসএস ফাইল তৈরি করুন
2. ট্যাগটিতে বা প্রতিটি পৃষ্ঠার জন্য বৈশিষ্ট্য শৈলী = "" ব্যবহার করে একই পৃষ্ঠাতে সমস্ত নির্দিষ্ট পৃষ্ঠা সিএসএস কোড প্রবেশ করান

এই উপায়টিতে আপনার কাছে সমস্ত ভাগ করা কোড এবং এইচটিএমএল পৃষ্ঠা সহ একটি সিএসএস রয়েছে। উপায় দ্বারা (এবং আমি জানি যে এটি সঠিক বিষয় নয়) আপনি আপনার চিত্রগুলি বেস 64 এ এনকোড করতে পারেন (তবে আপনি এটি আপনার জেএস এবং সিএসএস ফাইল দিয়েও করতে পারেন)। এইভাবে আপনি আরও আরও HTTP অনুরোধ 1 এ হ্রাস করুন।

Answer 13

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

http://sass-lang.com http://lesscss.org

শেষ পর্যন্ত একটি একক মিনিফাইড সিএসএস ফাইল হ'ল আপনি যা প্রযুক্তি ব্যবহার না করেই চান। কম সিএসএস, কম এইচটিটিপি অনুরোধ, সার্ভারে কম চাহিদা।

Answer 14

একক সিএসএস ফাইলের সুবিধা হ'ল স্থানান্তর দক্ষতা। প্রতিটি HTTP অনুরোধটির অনুরোধ করা প্রতিটি ফাইলের জন্য এইচটিটিপি শিরোনামের প্রতিক্রিয়া হয় এবং এটি ব্যান্ডউইথ লাগে th

আমি এইচটিটিপি শিরোনামে "পাঠ্য / সিএসএস" মাইম প্রকারের সাথে আমার সিএসএসকে পিএইচপি ফাইল হিসাবে পরিবেশন করি। এইভাবে আমি সার্ভারের পাশে একাধিক সিএসএস ফাইল রাখতে পারি এবং ব্যবহারকারীর দ্বারা অনুরোধ করা হলে পিএইচপি ব্যবহারের মধ্যে সেগুলিকে একটি একক ফাইলে ঠেকানো অন্তর্ভুক্ত থাকে। প্রতিটি আধুনিক ব্রাউজার সিএসএস কোড সহ .php ফাইল গ্রহণ করে এবং এটি একটি CSS ফাইল হিসাবে প্রসেস করে।

Comments

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

— Nate

হ্যাঁ, আমি রানটাইমের সময় আপনার সিএসএসকে একত্রিত করার জন্য একটি আইএইচটিপিহ্যান্ডলার ব্যবহার করব (উপরে আমার

— উত্তরটিতে

@ নেট: যখন আমি এএসপি.নেটে কাজ করছিলাম তখন আমরা একই জিনিসটি সম্পাদনের জন্য টেম্পলেট ফাইলগুলি ব্যবহার করি।

— রোবস্তো

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

— চেজ ফ্লোরেল

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

— চেজ ফ্লোরেল

Answer 15

আপনি পারফরম্যান্সের জন্য কেবল একটি সিএসএস ফাইল ব্যবহার করতে পারেন এবং তারপরে বিভাগগুলির মত মন্তব্য করতে পারেন:

/******** Header ************/
//some css here

/******* End Header *********/


/******** Footer ************/
//some css here

/******* End Footer *********/

ইত্যাদি

Comments

এটি রক্ষণাবেক্ষণ করা সহজ করে তোলে না, যেহেতু আমার পরে কী হবে তা পেতে আমার এখনও অবৈধ সিএসএসের মধ্য দিয়ে স্ক্রোল করতে হবে ...

— নট

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

— ডেভ শেরোহমান

একাধিক-বিকাশকারী পরিবেশে এটি বজায় রাখা আরও শক্ত। আপনার উপরের উদাহরণে "শিরোনাম" কী? যদি অন্য কেউ ভৌগলিকভাবে চিন্তা না করে তবে বোতাম বা মেনুগুলির মতো বেসিক ডিজাইনের উপাদানগুলির বিবেচনা করে থাকে তবে অন্যরা আলাদাভাবে চিন্তা করছেন? যদি একটি মেনু শিরোনামে থাকে তবে কোথায় যাবে? তা না হলে কেমন হয়? আমি মনে করি পৃথক ফাইলগুলিতে এই জাতীয় শৃঙ্খলা প্রয়োগ করা আরও সহজ। কেন অ্যাপ্লিকেশন বিকাশকারীরা শ্রেণি শ্রেণিবিন্যাসের কাঠামোর পরিবর্তে সমস্ত ছাঁটাই সহ একটি বিশাল অ্যাপ্লিকেশন শ্রেণি তৈরি করে না? আমার সাথে একই রকম মনে হচ্ছে।

— রোবস্তো

আপনি যে শ্রেণীর সন্ধান করছেন তার নাম মনে না থাকলে কী হবে? অথবা আপনি কীভাবে সিদ্ধান্ত নেবেন কোথায় নতুন ক্লাস যুক্ত করবেন?

— Nate

যদি এটি কেবল একটি দম্পতি পৃষ্ঠাগুলির ওয়েবসাইট হয় তবে এটি কোনও চুক্তির মধ্যে এত বড় নয়। কিছু করার জন্য অন্য উপায়ের পরামর্শ দিচ্ছি।

— ক্যাটফিশ

Answer 16

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

Answer 17

একটি বান্ডিলযুক্ত স্টাইলশীট পৃষ্ঠা লোড পারফরম্যান্সকে বাঁচাতে পারে তবে ব্রাউজারটি যে পৃষ্ঠায় রয়েছে তাতে অ্যানিমেশনগুলি যত ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে উপস্থাপিত হবে তা তত বেশি are এটি বিপুল পরিমাণ অব্যবহৃত শৈলীর কারণে ঘটে যা আপনি যে পৃষ্ঠায় রয়েছেন তা নাও হতে পারে তবে ব্রাউজারটি এখনও গণনা করতে হয়।

দেখুন: https://benfrain.com/css-performance-revisited-selectors-bloat-expense-styles/

বান্ডিল স্টাইলশিট সুবিধা: - পৃষ্ঠা লোড কর্মক্ষমতা

বান্ডিলযুক্ত স্টাইলশিটের অসুবিধাগুলি: - ধীর আচরণ, যা স্ক্রোলিং, ইন্টারঅ্যাক্টিভিটি, অ্যানিমেশন,

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

প্রতি পৃষ্ঠায় কোন ভাগ করা উপাদানগুলির প্রয়োজন, এবং জটিলতা হ্রাস করতে, এই নির্দিষ্ট পৃষ্ঠাটি ব্যবহার করা সমস্ত উপাদানগুলি ঘোষণা করা ভাল হবে - উদাহরণস্বরূপ:

<style href="global.css" rel="stylesheet"/>
<body data-shared-css-components="x,y,z">

Answer 18

আমি সিএসএস বিকাশে একটি নিয়মতান্ত্রিক পন্থা তৈরি করেছি। এইভাবে আমি এমন একটি মান ব্যবহার করতে পারি যা কখনই পরিবর্তিত হয় না। প্রথমে আমি 960 গ্রিড সিস্টেম দিয়ে শুরু করেছি। তারপরে আমি বেসিক লেআউটগুলি, মার্জিন, প্যাডিং, ফন্ট এবং আকারগুলির জন্য সিএসএসের একক লাইন তৈরি করেছি। আমি তখন প্রয়োজন হিসাবে তাদের একসঙ্গে স্ট্রিং। এটি আমার সমস্ত প্রকল্পের মধ্যে একটি সামঞ্জস্যপূর্ণ বিন্যাস রাখার এবং একই সিএসএস ফাইলগুলিকে বারবার ব্যবহার করার অনুমতি দেয়। কারণ এগুলি নির্দিষ্ট নয়। এখানে একটি উদাহরণ রয়েছে: ---- দ্বি শ্রেণি = "সি 12 বিজি0 এম 10 পি 5 হোয়াইট ফ্ল" / ডিভ --- এর অর্থ এই যে ধারকটি 12 টি কলাম জুড়ে রয়েছে, বিজি 0 টি 10px প্যাডিংয়ের মার্জিনযুক্ত 5 টি পাঠ্য সাদা এবং এটি ভাসমান পড়ে থাকবে। আমি সহজেই কোনও নতুন মুছে ফেলা বা যুক্ত করে এটি পরিবর্তন করতে পারি - যাকে আমি "হালকা" স্টাইল বলি-এই সমস্ত বৈশিষ্ট্য সহ একটি একক শ্রেণী তৈরি করার পরিবর্তে; পৃষ্ঠাটি কোড করার সাথে সাথে আমি একক শৈলীগুলিকে একত্রিত করি। এটি আমাকে শৈলীর কোনও সংমিশ্রণ তৈরি করতে দেয় এবং আমার সৃজনশীলতাকে সীমাবদ্ধ করে না বা আমাকে প্রচুর পরিমাণে শৈলী তৈরি করার কারণ দেয় না। আপনার স্টাইলের শীটগুলি অনেক বেশি পরিচালনাযোগ্য, ন্যূনতম হয়ে যায় এবং আপনাকে এটিকে বারবার ব্যবহার করতে দেয়। এই পদ্ধতিটি আমি দ্রুত ডিজাইনের জন্য দুর্দান্ত বলে মনে করেছি। আমি আর পিএসডি তে প্রথমে ডিজাইন করি না বরং ব্রাউজারেও সময় সাশ্রয় করে। এ ছাড়াও যেহেতু আমি আমার ব্যাকগ্রাউন্ড এবং পৃষ্ঠা ডিজাইনের বৈশিষ্ট্যগুলির জন্য একটি নামকরণ সিস্টেমও তৈরি করেছি নতুন প্রকল্প তৈরি করার সময় আমি কেবল আমার চিত্র ফাইলটি পরিবর্তন করি ((বিজি0 = আমার নামকরণ সিস্টেম অনুসারে বডি ব্যাকগ্রাউন্ড) এর অর্থ এই যে যদি আমার আগে কোনও সাদা থাকত একটি প্রকল্পের সাথে এটি ব্যাকগ্রাউন্ডে কেবল কালোতে পরিবর্তন করা হয়েছে এর অর্থ হ'ল পরবর্তী প্রকল্পে বিজি 0 একটি কালো পটভূমি বা অন্য কোনও চিত্র হবে .....

Comments

আপনি কি জানেন যে অনুচ্ছেদের জন্য কি?

— এম 1

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

— অগুরোন