সিএলআই সিএসএস প্রি-প্রসেসরের বিকল্পটি: ডার্ট-সাস ভিএস নোড-স্যাস?


107

সিএলআই (v3.7.0) দিয়ে একটি নতুন প্রকল্প তৈরি করার সময়, এর মধ্যে dart-sassবা node-sassসংকলক চয়ন করার বিকল্প রয়েছে ।

এগুলি কীভাবে একে অপরের সাথে তুলনা করে, ভু ডক্সে ঘোষণার চেয়ে আরও নির্দিষ্ট হতে পারে ?

সাস পারফরম্যান্স সম্পর্কে একটি টিপ

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

npm install -D fibers

দয়া করে সচেতন হন, এটি একটি নেটিভ মডিউল হিসাবে, সামঞ্জস্যের সমস্যাগুলি ওএসে পরিবর্তিত হতে পারে এবং পরিবেশ তৈরি করতে পারে। npm uninstall -D fibersসেক্ষেত্রে সমস্যাটি সমাধান করতে দয়া করে চালান ।

? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): (Use arrow keys)
❯ Sass/SCSS (with dart-sass)
  Sass/SCSS (with node-sass)
  Less
  Stylus

2020/01 সম্পাদনা করুন: Cue 4.2.2 নতুন প্রকল্প তৈরি করা এখনও dart-sassআগে প্রথম বিকল্প হিসাবে পরামর্শ দিচ্ছে node-sass। তবুও এটি এখানে প্রতিষ্ঠিত হয়েছে যে node-sassআরও পারফরম্যান্স পছন্দ, এবং প্রায় কেউই ডার্ট- স্যাস (স্লাইভের মন্তব্য) ব্যবহার করে না।

সম্পাদনা 2020/09: আলী Bahrami তার ব্যাপক উত্তর আপডেট, dart-sassপছন্দসই পছন্দ হিসাবে node-sassহিসাবে অবচিত হিসাবে চিহ্নিত করা হচ্ছে

dart-sassএটিতে খুব খারাপ একটি জেএস-সংকলিত সংস্করণটির খারাপ অভিনয় রয়েছে। তবে, এর বিকাশকারীরা এটি সম্পর্কে ভাল জানেন এবং এই ইস্যুতে বর্ণিত হিসাবে আরও বেশি পারফরম্যান্সের দিকে কাজ করছেন ।


4
2020 ফেব্রুয়ারি পর্যন্ত, দেখা যাচ্ছে যে কেউ ডার্ট-সাস ব্যবহার করছে না: npmtrends.com/dart-sass-vs-node-sass । নোডের প্রতি সপ্তাহে 3.5 মিলিয়ন ডাউনলোড, ডার্টের জন্য 16,000
স্লাইভ

4
যে @ccleve কারণ ডার্ট-Sass অধিকাংশ প্রচন্ডভাবে-ব্যবহৃত বন্টন Sass প্যাকেজ, বর্তমানে মে 2020 হিসাবে 2 মিলিয়ন সাপ্তাহিক ডাউনলোডসমূহ যা হয় npmtrends.com/sass-vs-node-sass
sebu

4
আমি কেন আগ্রহী যে এনপিএম-এ দুটি ডার্ট-স্যাস বাস্তবায়ন কেন। Sass বর্তমানে যখন সর্বশেষ, বনাম 1.26.5 এ ডার্ট-Sass 1.25 হয়। নির্বিশেষে নোড-স্যাস এখনও এই দুটি সংযুক্ত করে বামন করে: npmtrends.com/sass-vs-node-sass-vs-dart-sass
orionrush

উত্তর:


111

আপডেট 09/17/2020 :

যেহেতু এই উত্তরটি প্রতিদিন উপরে উঠে যায়, আমি ভেবেছিলাম এটি সম্ভবত এই বিষয়টির আরও গভীরভাবে ডুব দেওয়া।


সাস-ল্যাং ওয়েবসাইট বিবেচনা :

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

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

  • ডার্ট-ভিএম-এ ডার্ট-স্যাস
  • খাঁটি জেএস সংকলিত সংস্করণ যা এনপিএম -এ ডার্ট-স্যাস

আমি নোড-স্যাস, ডার্ট-স্যাস এবং ডার্ট-স্যাস (জেএস) সহ সিএসএসে বুটস্ট্র্যাপ 4 স্যাস ফাইল সংকলন করেছি এবং আপনি নিম্নলিখিত ফলাফলটি দেখতে পারেন:

নোড-সাস এবং ডার্ট-স্যাস তুলনা - উত্স: https://itnext.io/the-css-preprocessor-dilemma-node-sass-or-dart-sass-32a0a096572?source=friends_link&sk=3c465b78a0e1bc98379afd818546f46

  • এই বিশেষ ক্ষেত্রে, দুই সেকেন্ড কোনও বড় বিষয় নয়; তবে বিবেচনা করুন ডার্ট-স্যাস (জেএস) ডার্ট-স্যাসের (ডার্ট ভিএম) তুলনায় নয় গুণ এবং নোড-স্যাসের চেয়ে তিনগুণ ধীর।
  • আমার কাছে +২০ থিম নিয়ে একটি প্রকল্প ছিল, নোড-স্যাসের সাথে এটি 30 সেকেন্ড সময় নিয়েছে, তবে আমি ডার্ট-স্যাস (জেএস) ব্যবহার করার চেষ্টা করেছি এবং এটি একটি সেঞ্চুরি নিয়েছে!
  • যদিও ডার্ট-স্যাস (ডার্ট ভিএম) দ্রুততম তবে এটি ইনস্টল বা সংহত করা কিছুটা জটিল।
  • এবং নোড-সাসকে অবমূল্যায়ন হিসাবে বিবেচনা করা হয়

আমি এটি সম্পর্কে এখানে ব্লগ করেছি, আপনি এখানে এটি সম্পর্কে আরও পড়তে পারেন।


4
শেষ লাইনে, আপনার মানে dart-sassকি দ্রুত?
দক্ষম

4
দুঃখিত, আমি অন্য উত্তরে মন্তব্য করতে
চাইছিলাম, কোনওরকমভাবে

5

নোড-স্যাস ডার্ট-সাসের চেয়ে দ্রুত হতে পারে তবে এই ডার্ট-স্যাস লেখার ক্ষেত্রে একমাত্র গ্রন্থাগার যা @useনিয়মটি প্রয়োগ করে , যা দৃ strongly়ভাবে সুপারিশ করা হয় @import। সরকারী সাস-ল্যাং ওয়েবসাইট অনুসারে :

এর সাথে ভুল কি @import? @importনিয়ম গুরুতর বিষয় একটি নম্বর আছে:

  • @importসমস্ত ভেরিয়েবল, মিক্সিন এবং ফাংশনকে বিশ্বব্যাপী অ্যাক্সেসযোগ্য করে তোলে। এটি লোকেদের (বা সরঞ্জামগুলি) কোন কিছুর সংজ্ঞা দেওয়া আছে তা বলা খুব কঠিন করে তোলে।

  • কারণ সমস্ত কিছু বিশ্বব্যাপী, গ্রন্থাগারগুলি নামকরণের সংঘর্ষ এড়াতে তাদের সমস্ত সদস্যের উপসর্গ করতে হবে।

  • @extend বিধিগুলিও বিশ্বব্যাপী, যা কোন স্টাইলের বিধিগুলি প্রসারিত হবে তা অনুমান করা শক্ত করে তোলে।

  • প্রতিটি স্টাইলশিট সম্পাদন করা হয় এবং এর সিডিএস প্রতিবার এটি @importসম্পাদিত হয়, যা সংকলনের সময় বাড়ায় এবং ফুলে আউটপুট উত্পাদন করে।

  • ডাউন স্ট্রিম শিটগুলিতে অ্যাক্সেসযোগ্য ব্যক্তিগত সদস্য বা স্থানধারক নির্বাচকদের সংজ্ঞা দেওয়ার কোনও উপায় ছিল না।

নতুন মডিউল সিস্টেম এবং @useনিয়ম এই সমস্ত সমস্যার সমাধান করে।

অতিরিক্তভাবে, পরবর্তী কয়েক বছরের মধ্যে ধীরে ধীরে পর্যায়ক্রমে আউট@import করা হবে এবং শেষ পর্যন্ত ভাষা থেকে সম্পূর্ণভাবে মুছে ফেলা হবে।

সাসের সেরা অনুশীলনের সাথে আপ টু ডেট থাকার জন্য আপনার আপাতত ডার্ট-স্যাস (অর্থাত্ স্যাস ) ব্যবহার করা উচিত ।


4
এছাড়াও, ডার্ট-Sass এবং নোড-Sass মধ্যে জনপ্রিয়তার তুলনা অধিকাংশ মানুষ ব্যবহার বিবেচনা করা অত্যন্ত কপটতা, Sass পরিবর্তে ডার্ট-Sass , এই দুই ধরনের এর ডিস্ট্রিবিউশন হয় ডার্ট Sass
রাসনফ

খুব আকর্ষণীয় @ রাসনাউফ, এটি দেখানোর জন্য অনেক ধন্যবাদ! কিছু প্রকল্পের সাথে যা বড় লাইব্রেরির .scss ফাইলগুলি আমদানি করে, একটি .scss ফাইলে এমনকি একটি ছোটখাটো পরিবর্তন করা খুব কষ্টকর হয়ে পড়েছিল এবং সমস্ত ফাইলগুলি পুনর্নির্মাণের জন্য অপেক্ষা করতে হবে ... আমি @useএ সম্পর্কে যা পড়েছি তার জন্য পয়েন্ট, দেখে মনে হচ্ছে এটি দেব করার সময় ক্রমবর্ধমান বিল্ডগুলির সাথে পুনর্নির্মাণের সময়গুলিতে নাটকীয়ভাবে উন্নতি করতে পারে :)
ux.engineer
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.