সিএসএস মিনিফায়ারের জন্য কোনও প্রস্তাবনা? [বন্ধ]


289

সিএসএস মিনিফায়ারের জন্য কোনও প্রস্তাবনা?

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



20
Busted। আমি 'কীভাবে বন্ধুবান্ধব এবং প্রভাবকে মানুষ তৈরি কর' তা পড়ছি। যদিও কাছাকাছি যথেষ্ট না
পল ডি ওয়েট

17
ছেলেরা সবাই অদ্ভুত। আমরা স্মার্ট, দক্ষ এবং কৌতূহলীভাবে সুদর্শন।
চক লে বাট

2
আরও দেখুন: stackoverflow.com/q/65491/85414
mahalie

3
প্রায় কাছাকাছি বিষয়গুলির 'পরিবর্তিত প্রকৃতি' বোঝার জন্য এবং এই জাতীয় প্রশ্নগুলি বন্ধ করার যুক্তিটি বোঝার এবং ব্যাখ্যা করার জন্য +1 - যদিও এটি আপনার! ;)
অ্যান্ড্রু বার্বার

উত্তর:


98

Yui কম্প্রেসার কল্পনাপ্রসূত। এটি জাভাস্ক্রিপ্ট এবং সিএসএসে কাজ করে। এটা দেখ.


4
এটি যোগ করার পরে, এখানে একটি মেকফাইল রয়েছে যা YUI সংক্ষেপকটি ডাউনলোড করবে, আপনার ফাইলগুলি প্যাক করবে এবং সেগুলি ছোট করবে। github.com/balupton/jquery-sparkle/blob/…
বালুপটন


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

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

আপনি অনলাইন পরিষেবা zbugs.com চেষ্টা করতে পারেন - এটি আপনার ফাইলগুলি খাটো করার জন্য yui সংক্ষেপক ব্যবহার করে।
তামিক সোজিভ

45

এর রয়েছে Yui কম্প্রেসার একটি .NET বন্দর যা আপনি করতে পারবেন: -

  • ভিজুয়াল স্টুডিও-পরবর্তী বিল্ড ইভেন্টগুলিতে সংমিশ্রণ / ফাইলটি সংহত করুন
  • একটি টিএফএস বিল্ডে সংহত করুন (সিআই সহ)
  • যদি আপনি কেবল নিজের কোডে dll গুলি ব্যবহার করতে চান (যেমন: ফ্লাই মিনিফিকেশনে)।

আপডেট ২০১১: এবং এটি এখন নুগেটের মাধ্যমেও পাওয়া যায় :)


আমি একটু বিভ্রান্ত YUI কমপ্রেসরকে UglifJS ( ডেমো ) এর পক্ষে অবমুক্ত করা হয়েছে । .NET পোর্টে কাজ করার অর্থ কী?
মার্টিন ভ্যাসেটিকা

সাথী। আমি ২০০৮ বা তারও মধ্যে সেই বন্দরটি শুরু করেছি। এটি আজ অবাক। আমি এই উত্তরটি '09-এও পোস্ট করেছি। সুতরাং দয়া করে খালি তারিখগুলি পরীক্ষা করুন এবং আপনি নির্বোধ কিউ জিজ্ঞাসা করার আগে কিছু প্রসঙ্গ পাবেন। এখন, বাইরে যান এবং একটি সামান্য বিট জন্য খেলুন :)
শুদ্ধ। ক্রোম

খাঁটি.ক্রোম: আমি আলাদা হতে অনুরোধ করছি। আমি গিটহাব রেপোতে দেখেছি এবং এটি কয়েক মাস পুরানো এবং এই বছরের কমিটগুলি রয়েছে। ঐ জন্যই আমি জিজ্ঞাসা করেছিলাম. "Mate"।
মার্টিন ভ্যাসেটিকা

: ধীর তালি: ভাল দাগ! আপনি আসলে righ --- ওহ। অপেক্ষা করুন। আমি কোডপ্লেক্সে প্রজ শুরু করেছি: yuicompressor.codeplex.com । প্রথমে 7 জুলাই 2008 কমিট করুন ( yuicompressor.codeplex.com/SourceControl/ بدلset/… )। তারপরে এই বছর এটিকে জিএইচে স্থানান্তরিত করুন । আমি এএলং.টাইমের জন্য পোর্টিংয়ের কোনও কাজ করিনি। এখানে এবং সেখানে কয়েকটি কয়েকটি বিজোড় বাগ সংশোধন হয়েছে। So. শহরবাসী. আমি ইডি এটি বন্দর । বন্দর না ing করুন। এটি রক্ষণাবেক্ষণের মোডে। QED
খাঁটি.ক্রোম

1
আপনিও :) এবং উগলিফজেজে লিঙ্কের জন্য চিয়ার্স - এটি এমন কিছু ছিল যা আমরা কাজের জায়গায় এটি ব্যবহার করতে পারি কিনা তা যাচাই করে দেখার অর্থ হয়েছিল - এবং আপনি কেবল এটি সম্পর্কে আমাদের মনে করিয়ে দিয়েছেন! চিয়ার্স :)
খাঁটি.ক্রোম

19

আমি চাই অল্প করা । পিএইচপি এবং সিএসএস বা জাভাস্ক্রিপ্ট সঙ্গে কাজ করে।


2
মিনিফাইটির জন্য +1। আপনি যদি ইতিমধ্যে পিএইচপি এর সাথে পরিচিত হন তবে আপনি এটি ইনস্টল করতে আরও স্বাচ্ছন্দ্যবোধ করতে পারেন। পিএইচপি 5 প্রয়োজন। এটি সেট আপ হয়ে গেলে আপনি এটিকে ভুলে যেতে পারেন, যতগুলি সুপার হোয়াইট-স্পেসড এবং কমেন্টেড সিএসএস বা জেএস ফাইলে আপনি চান হিসাবে স্বাভাবিক হিসাবে কাজ করুন এবং মিনিফাইয়ে এগুলি ফ্লাইতে সংকুচিত করবে।
মহালি

13

সিএসএসও বর্তমানে সেরা মিনিফায়ার / অপটিমাইজার।


2
"সেরা" সম্পর্কে ডুনো, তবে এক নজর দেখার মতো।
পল ডি ওয়েট

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

1
ঠিক আছে, আমি সিএসএসওকে 30 কেবি টেস্ট ফাইলের সাথে ইউইউআই কমপ্রেসারের সাথে তুলনা করেছি এবং উভয় সরঞ্জামের সংকুচিত আউটপুট গিজিপ করার পরে, সিএসএসও জিতেছে, অতিরিক্ত 7 বাইট দ্বারা ফাইলটি সংকুচিত করেছে। অবশ্যই এটি অবশ্যই একটি পরীক্ষার ফাইল।
পল ডি ওয়েট 21

সিএসএস-এর মাধ্যমে সিএসএস অনলাইন হ্রাস করুন: css.github.io/csso/csso.html
টমবায়ার

কমপক্ষে এটি গুগল পেজস্পিড অন্তর্দৃষ্টি দ্বারা প্রস্তাবিত দুটির মধ্যে একটি ।
অ্যালেক্স ভ্যাং

8

আপনি ব্যবহার করেন তাহলে পাইথন আমি সুপারিশ করবে slimmer সম্ভবত হিসাবে দ্রুত Yui কম্প্রেসার যেমন নয়, কিন্তু অসদৃশ csscompressor.net এটা সিএসএস হ্যাক উপর শ্বাসরোধ করে না।

আমি স্লিমার লেখার পর থেকে আমি পক্ষপাতদুষ্ট এবং বর্তমানে হ্যাকগুলি কীভাবে পরিচালনা করে তা দেখতে আমি YUI কমপ্রেসরকে মূল্যায়ন করছি। ক্রস স্লিমার উদাহরণটি যদি আপনি ক্রসটিপস.আর্গ.র উত্সটি দেখেন তবে দেখা যেতে পারে


6

সিএসএসটিডি দেখুন: http://csstidy.sourceforge.net/usage.php

এবং অনলাইনে: http://cdburnerxp.se/cssparse/css_optimiser.php


এটিই সর্বোত্তম. ধন্যবাদ
এফডিস্ক

সিএসএস 3 সমর্থন করে একটি পরিবর্তিত অনলাইন সংস্করণ শাইলো.ওস
রাফেলিয়ো

6

আপনি যদি কোনও অনলাইন সরঞ্জামের সন্ধান করছেন তবে এটি ব্যবহার করে দেখুন: https://csscompressor.net/


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

19
তবে, আপনার কি মূল, মান সম্মত সিএসএস থাকা উচিত নয় ?
চক লে বাট

2
আপনি যদি এইচটিএমএল 5 বয়লারপ্লেট ব্যবহার করেন তবে তা না।
SkaveRat

দুর্দান্ত সরঞ্জাম আমি এটি পরীক্ষা করেছি html{width:100%;height:100%;} body{width:100%;height:100%;padding:0;} #test{padding:1em;width:10em;} #test{padding:2em;}এবং এটি ওয়াইউআই কমপ্রেসারের চেয়ে ভাল কাজ করেছে (যা # পরীক্ষার প্যাডিংয়ের জন্য সদৃশগুলি মুছে ফেলেনি)। তবুও, উভয়ই আমাকে সন্তুষ্ট করতে ব্যর্থ হয়েছিল html,body{width:100%;height:100%}body{padding:0}(যা আমার বোঝার দিক দিয়ে সমান, কারণ উভয় নির্বাচকই একই স্বতন্ত্রতা)।
drdaeman

সিএসএস হ'ল এক জিনিস যেখানে ক্রেডি হ্যাকগুলি কখনও কখনও গ্রহণযোগ্য। এই হ্যাকগুলির মধ্যে কয়েকটি অদ্ভুত মন্তব্য কৌশলগুলি ব্যবহার করে যা মাইনফিকেশনটি ভেঙে যেতে পারে।
ব্র্যান্ডন

4

আমি সি # তে একটি অতি দ্রুত সিএসএস মিনিফায়ার লিখেছি। অ্যালগরিদম যদিও জাভাস্ক্রিপ্ট পরিচালনা করে না। এটি আপনার: http://www.ko-sw.com/Blog/post/An-Ultra-Fast-CSS-Minify-Algorithm.aspx


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

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

4

ক্লোজার-স্টাইলশিট চেষ্টা করুন ।

পাশে minification এটি সমর্থন linting , আরটিএল আলোকসম্পাতের , এবং বর্গ পুনঃনামকরনের

এটি CSS এ ভেরিয়েবল , ফাংশন , শর্তাদি এবং মিক্সিন যুক্ত করতে পারে।

আরও লক্ষ করুন যে এগুলির কয়েকটি বৈশিষ্ট্য বন্ধকরণ সরঞ্জামগুলির বিশ্রামের উপর নির্ভর করে (যা তাদের নিজেরাই খুব শক্তিশালী)।


আপনি এটি উইন্ডোতে কীভাবে ব্যবহার করবেন? আমার অজ্ঞতা ক্ষমা করুন
ব্যবহারকারী 2513846

3

আপনি যদি পিএইচপি-তে কিছু সন্ধান করছেন তবে লিঙ্কটি এখানে:

ফ্যাট-ফ্রি মিনিফাই

যদিও এটি পিএইচপি ফ্যাট-ফ্রি ফ্রেমওয়ার্কের অংশ, এটি একা একা ব্যবহার করা যায়।


ফ্যাট ফ্রি ফ্রেমওয়ার্কটি জিপিএল এবং সুতরাং আমি তাদের কোডের এই অংশটি খুব অনুমান করি is শুধু একটি মাথা আপ।
কোডারিপার

এটিতে বাগ রয়েছে: এস খারাপ ধারণা।
ব্রুনোইস

3

আমি দেখতে পেয়েছি যে আইসনুপের সিএসএস সুপারসক্রাব খুব ভালভাবে কাজ করে। এটি কেবলমাত্র অনলাইনে সিএসএস-এর সরাসরি লিঙ্কগুলি পরিচালনা করতে পারে: / আপনি সিএসএস কোড ধরে রাখতে আপনার পছন্দের পেস্টবিন পরিষেবাটি ব্যবহার করে এবং সুপারসক্রাবকে কাঁচা লিঙ্কটি দিয়েই তা পেতে পারেন।


আমি চেষ্টা করেছি #test { padding: 1em; width: 10em; } #test { padding: 2em; }এবং এটি ব্যর্থ হয়েছে।
drdaeman

@drdaeman সম্ভবত এটি কারণ কোনও প্রদত্ত নির্বাচকের জন্য বিরোধী / সদৃশ মানগুলির সাথে কী করবেন তা জানেন না। যেহেতু আমি সুপারস্ক্রাবটি বজায় রাখছি না, তাই কখন বা কখন ঠিক করা হবে তা আমি আপনাকে বলতে পারি না।
জন মিশেল

3

যদি আপনার সাইটটি এএসপি.নেটে থাকে তবে আপনি আপনার সাইটটিকে ফ্লাইতে সিএসএস মিনিফিকেশন করতে দিতে পারেন (যাতে আপনি প্রতিবার পরিবর্তন করার সময় আপনাকে ম্যানুয়ালি এটি করতে হবে না)। উদাহরণস্বরূপ:

http://www.codeproject.com/KB/aspnet/CombineAndMinify.aspx



3

অন্যরা YUI কমপ্রেসর উল্লেখ করেছেন, তারপরে এটি। নেট বন্দর এবং আমি চেইনে অন্য লিঙ্ক যুক্ত করব। স্টাইলম্যানেজার হ'ল একটি সার্ভার কন্ট্রোল যা ওয়াইউআই কমপ্রেসারের । নেট পোর্টটি গুটিয়ে রাখে যাতে আপনি স্ক্রিপ্টম্যানেজারটি ব্যবহার করার মতো ব্যবহার করছেন। এটি সিএসএস কনস্ট্যান্টস, টিলডে (~) রেজোলিউশন ডাব্লু / আপনার ব্যাকগ্রাউন্ড-চিত্র সংজ্ঞা ইত্যাদির মতো অন্যান্য চমৎকার বৈশিষ্ট্যগুলির একটি গুচ্ছ যুক্ত করে, এটি শক্ত, ভাল নথিভুক্ত, এবং আমি আমার সাম্প্রতিক প্রকল্পগুলিতে ব্যবহার করেছি ডাব্লু / হে একটি সমস্যা এটি পরীক্ষা করে দেখুন - gStyleManager.com


3

এখনও "বিটা ইন", তবে মোটামুটি ভালভাবে কাজ করা উচিত। আমি প্রতিটি প্রকল্পে এর পিছনে কোডটি ব্যবহার করি: http://claudiu.phpfogapp.com/ এটি পিএইচপিতে নির্মিত এবং আপনার * .css ফাইলকে যথেষ্ট পরিমাণের জন্য হোস্ট করে, অবশ্যই আপনাকে আপনার কোডটি পরীক্ষা করার জন্য যথেষ্ট মিনিড সিএসএস (সার্ভারে স্থান ভিড় করলে আমি কেবল পুরানো CSS ফাইলগুলি মুছব)।


2

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

যাইহোক লিঙ্কটি হ'ল http://xpedite.codeplex.com/wikipage?title=Minifier%20(CSS%2FJavaScript%20 মিনিফিকেশন ২০২০ হ্যান্ডলারের )


2

এমভিসি 3 এর জন্য এটি আমি এইভাবে করেছি: http://mkramar.blogspot.com/2011/08/css-and-javascript-minify-and-combine.html এই পদ্ধতির সৌন্দর্য হ'ল এটি উড়তে সমস্ত কিছু করে এবং আপনাকে ম্যানুয়ালি ফাইলগুলি প্রাক-প্রক্রিয়া করতে বা পোস্ট-বিল্ড কনফিগার করতে হবে না।


2

একটি অনলাইন সরঞ্জাম (www.csscompressor.net এর চেয়ে অনেক বেশি ভাল যা আমার সিএসএসটিকে জ্যাক করেছে): http://www.cssdrive.com/compressor/compress.php একটি দুর্দান্ত কাজ করে।


বাগ আছে। নির্দিষ্ট পরিস্থিতিতে এটি পুরোপুরি ভাল
জেএস

1

সি # উদাহরণ:

css = css.Replace("\n", "");
css = Regex.Replace(css, @"\s+", " ");
css = Regex.Replace(css, @"\s*:\s*", ":");
css = Regex.Replace(css, @"\s*\,\s*", ",");
css = Regex.Replace(css, @"\s*\{\s*", "{");
css = Regex.Replace(css, @"\s*\}\s*", "}");
css = Regex.Replace(css, @"\s*\;\s*", ";");

1

zbugs.com আপনার জন্য একটি ভাল অনলাইন সরঞ্জাম হয়ে উঠবে, এটি আপনার সিএসএসকে একক ক্লিকে ছোট করে দেবে


অবশ্যই, যদিও আমি মনে করি না এমন অনেক মিনিফায়ার রয়েছে যেগুলি শুরু করার জন্য একাধিক ক্লিকের প্রয়োজন।
পল ডি ওয়েট

আপনি পল ঠিকই বলেছেন :) তবে এটি আরও অনেক কিছু করে
কেবলমাত্র মাইনাইফ

1

পল আইরিশ দ্বারা সর্বশেষ এইচটিএমএল 5 বয়লারপ্লেটটি দেখুন - এতে আপনার সমস্ত সম্পদ (পিএনজি এবং জেপিজিসহ) অন্তর্ভুক্ত করার জন্য একটি বিল্ড স্ক্রিপ্ট রয়েছে। আপনি এখানে একটি ডেমো ভিডিও দেখতে পারেন ।


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