ec0lint

เว็บไซต์ | การกำหนดค่า | กฎ

EC0LINT เป็นเครื่องมือวิเคราะห์รหัสแบบคงที่ที่ให้คำแนะนำแก่ผู้ใช้เกี่ยวกับวิธีลดปริมาณการปล่อยก๊าซคาร์บอนไดออกไซด์ของเว็บไซต์ในระหว่างกระบวนการพัฒนา การใช้การเปลี่ยนแปลงรหัสที่แนะนำโดย ec0lint ส่งผลให้การปล่อยคาร์บอนลดลงต่อการเข้าชมการโหลดเร็วขึ้นและประสิทธิภาพของพื้นที่ที่สูงขึ้น เครื่องมือนี้เป็นโอเพนซอร์ซและชุมชนที่ขับเคลื่อนด้วย

เป้าหมายของเรา

คุณรู้หรือไม่ว่ามีการเผยแพร่เว็บไซต์มากกว่า 250,000 เว็บไซต์ทุกวัน?

ส่วนใหญ่ใช้แบบอักษรหนักเกินไปภาพที่มีขนาดใหญ่/ไม่จำเป็นเกินไปหรือใช้ห้องสมุดซ้ำซ้อน ปัจจัยเหล่านี้และอื่น ๆ สร้างรอยเท้าคาร์บอน ที่จริงแล้วมุมมองหนึ่งของเว็บไซต์เฉลี่ยปล่อย CO2 1.8 กรัมซึ่งมีผลรวมสูงสุด 216 กิโลกรัม CO2 ต่อปี น่าเสียดายที่โซลูชันปัจจุบันเพิ่มประสิทธิภาพเว็บไซต์ที่มีอยู่แล้วเท่านั้น

EC0LINT เป็นเครื่องมือสำหรับนักพัฒนาส่วนหน้าซึ่งช่วยลดการปล่อยก๊าซคาร์บอนไดออกไซด์ของเว็บไซต์ มันแสดงเคล็ดลับให้คำแนะนำวิธีสร้างรหัสที่เป็นมิตรกับสภาพภูมิอากาศมากขึ้น ด้วยการเพิ่มประสิทธิภาพรหัส EC0Lint สามารถช่วยในการลดการปล่อย CO2 ต่อมุมมองหนึ่งจาก 1.8 กรัมเป็น ~ 0.2 กรัมการประหยัด 198 กก. คาร์บอนไดออกไซด์ (-88%!) ทุกปี

เครื่องมือได้รับการปรับแต่งและแต่ละกฎที่ใช้ในระหว่างการวิเคราะห์สามารถปรับได้หรือถือว่าเป็นคำแนะนำมากกว่าข้อผิดพลาด ความยืดหยุ่นนี้ช่วยให้นักพัฒนาบรรลุเป้าหมายโดยไม่หยุดชะงักจาก ec0lint ในเวลาเดียวกันดึงความสนใจไปที่การปรับปรุงที่เป็นไปได้

เริ่มต้นใช้งาน

ตรวจสอบให้แน่ใจว่าคุณติดตั้งโหนด

(a) หากรหัสของคุณมีไฟล์ CSS

ดาวน์โหลด ec0lint:

npm i ec0lint ec0lint-style ec0lint-style-config-recommended

กำหนดค่าโครงการของคุณ:

npm init @ec0lint/config

สร้างไฟล์กำหนดค่า .ec0lint-stylerc.json ในรูทของโครงการของคุณด้วยเนื้อหาต่อไปนี้:

{ "extends": "ec0lint-style-config-recommended" }

(b) หากรหัสของคุณมีไฟล์ SASS/SCSS น้อยลง

npm i ec0lint ec0lint-style ec0lint-style-config-recommended-scss

กำหนดค่าโครงการของคุณ:

npm init @ec0lint/config

สร้างไฟล์กำหนดค่า .ec0lint-stylerc.json ในรูทของโครงการของคุณด้วยเนื้อหาต่อไปนี้:

{ "extends": "ec0lint-style-config-recommended-scss" }

(c) หากรหัสของคุณมี postcss / tailwind

npm i ec0lint ec0lint-style ec0lint-style-config-postcss

กำหนดค่าโครงการของคุณ:

npm init @ec0lint/config

สร้างไฟล์กำหนดค่า .ec0lint-stylerc.json ในรูทของโครงการของคุณด้วยเนื้อหาต่อไปนี้:

{ "extends": "ec0lint-style-config-postcss" }

หากคุณใช้ React

ติดตั้งปลั๊กอิน React (หรือใช้ NPM init):

npm i ec0lint-plugin-react

เพิ่มไปยังไฟล์กำหนดค่า .ec0lintrc.json ของคุณ:

 "extends": [
    "ec0lint:recommended",
    "plugin:react/recommended"
  ]

เรียกใช้ ec0lint

แยกเทอร์มินัลของคุณและเรียกใช้:

npx ec0lint-style "**/*.scss" npx ec0lint .

มาสร้างเว็บไซต์ที่เป็นมิตรกับสิ่งแวดล้อมกันเถอะ!

แผนการวางจำหน่าย

✅ v1.0.0 - มิถุนายน - MVP

• http ที่เบากว่า (เบา HTTP, ec0lint)
• ✅รูปแบบตัวอักษร (No-TTF-Font-Files, Ec0lint-style)
• ✅การตรวจสอบรูปแบบภาพ (รูปแบบภาพที่เบากว่า, สไตล์ ec0lint)
• ✅ Light Libraries - Lodash (หลีกเลี่ยง Lodash, ec0lint)
• ✅ Light Libraries-Date-FNS (NO-DATE-FNS, EC0LINT)
• ✅ Light Libraries-Moment.js (No-Moment-Js, Ec0lint)

✅ v2.0.0 - ตุลาคม - โมดูล CO2 + ปลั๊กอิน React

• ✅การคำนวณ CO2 (ec0lint)
• ✅การคำนวณ CO2 (สไตล์ EC0LINT)
• ✅ปลั๊กอิน React (ec0lint-plugin-react)
• ✅ Light Libraries - JQuery Ajax (No -Ajax, Ec0lint)
• ✅ Light Libraries-JQuery Ajax Events (No-Ajax-Events, Ec0lint)
• ✅ Font-Display (ต้องการ Font-Display, ec0lint-style)

✅ v2.1.0 - มกราคม - 20 การใช้งานกฎ, 15 กฎที่ไม่ซ้ำกัน

• ✅รูปแบบภาพ (รูปแบบภาพที่เบากว่า, ec0lint)
• ✅รูปแบบวิดีโอ (รูปแบบวิดีโอที่เบากว่า, ec0lint)
• ✅ปลั๊กอิน HTML (ec0lint-plugin-html)
• ✅การโหลดขี้เกียจ (ต้องการการโหลด-lazk, ec0lint-plugin-html)
• ✅แหล่งที่มาของตัวอักษร (ไม่โฮสต์แบบออนไลน์-แบบ, สไตล์ EC0LINT)
• ✅ Light Libraries-jQuery and self (ไม่มีและตัวเอง, ec0lint)
• ✅ Light Libraries-JQuery Animate (ไม่มีภาพรวม, ec0lint)
• ✅ไลบรารีแสง-jQuery attr (no-attr, ec0lint)
• ✅ Light Libraries-JQuery Bind (ไม่มีข้อผูกมัด, ec0lint)
• ✅วิดีโอเล่นอัตโนมัติ (ต้องการการเล่น Auto-Play, ec0lint)

- v3.0.0 - เมษายน - ปลั๊กอิน IDE + การสแกนทรัพยากร

• ☑ปลั๊กอิน vscode ec0lint
• - VSCODE ปลั๊กอินสไตล์ EC0LINT
• - Intellij ปลั๊กอิน ec0lint
• - Intellij Plugin ec0lint สไตล์
• - การตรวจสอบสี (การตรวจสอบสีพื้นหลัง, สไตล์ EC0Lint)
• - ขนาดภาพ (การตรวจสอบขนาดภาพ, สไตล์ ec0lint)
• - ขนาดวิดีโอ (การตรวจสอบขนาดวิดีโอ, สไตล์ ec0lint)
• ☑ไลบรารีแสง-รุ่นกล่อง jQuery (No-box-model, ec0lint)
• ☑ไลบรารีแสง-เบราว์เซอร์ jQuery (ไม่มีเบราว์เซอร์, ec0lint)

v4.0.0 - มิถุนายน - ปลั๊กอิน TypeScript

• ปลั๊กอิน TypeScript (ec0lint-plugin-typescript)
• HTTP ที่เบากว่า (เบา HTTP, EC0Lint-Plugin-typescript)
• Light Libraries-Lodash (หลีกเลี่ยง lodash, ec0lint-plugin-typescript)
• Light Libraries-Date-FNS (No-Date-FNS, Ec0lint-Plugin-typescript)
• Light Libraries-Moment.js (No-Moment-Js, Ec0lint-Plugin-typescript)
• Light Libraries-JQuery Ajax (No-Ajax, Ec0lint-Plugin-typescript)
• Light Libraries-กิจกรรม jQuery Ajax (No-Ajax-Events EC0Lint-Plugin-typescript)
• รูปแบบวิดีโอ (Format-Formats ที่เบากว่า, EC0LINT-PLUGIN-TYPESCRIPT)
• Lazy Loading (ต้องการการโหลด-lazk, ec0lint-plugin-typescript)
• Video-Play (Veuthe-Auto-Play, Ec0lint-Plugin-typescript)

v5.0.0 - กันยายน - รายงาน CI/CD

• รายงาน CI/CD
• การวิจัย - สคริปต์การติดตามผู้ใช้
• การวิจัย - โหมดมืด
• การวิจัย - กฎใหม่
• กฎใหม่

ต่อไป:

• งบประมาณเว็บไซต์
• ปลั๊กอินเชิงมุม
• ปลั๊กอิน VUE
• -ตัวเลือกการแก้ไข

ตำนาน:

• ✅เปิดตัว
• ☑ดำเนินการแล้วยังไม่ได้เปิดตัว
• - การดำเนินการ
• - งานที่จะใช้
• สิ่งที่ต้องทำในอนาคต

วิธีเริ่มต้นมีส่วนร่วม

หากคุณต้องการมีส่วนร่วมเพียงเขียนถึงเราและเริ่มเขียนโค้ด!

คุณสามารถดูงานที่ทำเครื่องหมายว่าเป็น? หรือในประเด็นของเรา (https://github.com/ec0lint/ec0lint/issues) และค้นหางานให้คุณ

ขอบคุณ!

เราเปิดรับความร่วมมือในการปรับปรุง EC0Lint และเรารู้สึกขอบคุณมากสำหรับการมีส่วนร่วมและข้อเสนอแนะทั้งหมดเกี่ยวกับเครื่องมือ ขอบคุณสำหรับการสร้างสภาพแวดล้อมดิจิทัลที่ยั่งยืนกับเรา!

conctact: [email protected]