หลังจากพัฒนามา 5 ปีในรูปแบบผลิตภัณฑ์เสียเงิน ระบบดีไซน์ Reshaped ได้ก้าวกระโดดไปสู่การเป็น open source อย่างเต็มรูปแบบ ไลบรารี UI ที่ครอบคลุมนี้ซึ่งเชื่อมโยงทั้งคอมโพเนนต์ React และไฟล์ดีไซน์ Figma เป็นตัวแทนของการเปลี่ยนแปลงที่สำคัญในวิธีที่ระบบดีไซน์พรีเมียมสามารถพัฒนาไปเพื่อให้บริการชุมชนนักพัฒนาที่กว้างขึ้น
ผู้สร้างเดิมทีสร้าง Reshaped เพื่อแก้ปัญหาทั่วไปในการพัฒนาเว็บ ความต้องการระบบดีไซน์ที่ครอบคลุมแพทเทิร์น UI เว็บหลัก 80% พร้อมทั้งให้ความยืดหยุ่นสำหรับการปรับใช้แบบกำหนดเอง ไลบรารีได้รับความนิยมผ่านโมเดลใบอนุญาตแบบเสียเงินที่สนับสนุนนักพัฒนาแต่ละคนและทีมใหญ่ด้วยการเข้าถึงซอร์สโค้ด
ไทม์ไลน์การพัฒนา
- เริ่มต้น: 5 ปีที่แล้ว (2019)
- ทำให้ React package ฟรี: 2 ปีที่แล้ว (2022)
- เปิดเป็น open source เต็มรูปแบบ: มกราคม 2025
ปัญหาประสิทธิภาพปรากฏขึ้นในการทดสอบของชุมชน
ผู้ใช้งานแรกได้ระบุปัญหาประสิทธิภาพหลายประการอย่างรวดเร็วกับเว็บไซต์เอกสารและคอมโพเนนต์ ผู้ใช้รายงานความล่าช้าที่เห็นได้ชัดเมื่อนำทางระหว่างส่วนเอกสาร โดยบางคนประสบกับการหยุดชะงักครึ่งวินาทีเมื่อสลับแท็บ การเรนเดอร์ฝั่งเซิร์ฟเวอร์ดูเหมือนจะเป็นต้นเหตุ โดยใช้เวลาประมาณ 500 มิลลิวินาทีในการเรนเดอร์เนื้อหาแบบคงที่
ทีมพัฒนาได้รับทราบปัญหาเหล่านี้และวางแผนที่จะแก้ไขโดยการย้ายไปใช้การส่งออกเว็บไซต์แบบคงที่เนื่องจากโค้ดเบสเป็นสาธารณะแล้ว ข้อบกพร่องเฉพาะคอมโพเนนต์หลายประการได้รับการรายงานเช่นกัน รวมถึงปัญหากับพฤติกรรมแฮนเดิลคู่ของคอมโพเนนต์สไลเดอร์และฟังก์ชัน backspace ในฟิลด์ autocomplete
ปัญหาด้านประสิทธิภาพที่รายงาน
- ความล่าช้าในการนำทางเอกสาร: ~500ms
- การค้างของการสลับแท็บ: ~0.5 วินาที
- ระบุคอขวดของการเรนเดอร์ฝั่งเซิร์ฟเวอร์แล้ว
- วางแผนการย้ายข้อมูลแบบ static export
คุณภาพคอมโพเนนต์ได้รับการตอบรับที่หลากหลาย
ความคิดเห็นของชุมชนเผยให้เห็นภาพที่มีความแตกต่างของคุณภาพคอมโพเนนต์ของไลบรารี แม้ว่าหลายคนจะชื่นชมความสวยงามของดีไซน์โดยรวมและชุดฟีเจอร์ที่ครอบคลุม นักพัฒนาได้สังเกตเห็นพื้นที่ที่ต้องปรับปรุงในไมโคร-อินเทอร์แอคชันและแอนิเมชัน การเปลี่ยนป้ายกำกับของคอมโพเนนต์สไลเดอร์และการขาดฟังก์ชันลากของคอมโพเนนต์สวิตช์ได้รับการเน้นย้ำเป็นตัวอย่างที่ประสบการณ์ผู้ใช้สามารถปรับปรุงได้
สิ่งเหล่านี้เห็นได้ชัดน้อยกว่าไลบรารีอื่น ๆ มาก (รวมถึงไลบรารีที่อ้างว่าได้รับการออกแบบอย่างพิถีพิถัน ...) และฉันต้องขยายพร็อพสำหรับเกือบทุกสิ่งที่เคลื่อนไหวเข้ามาให้เคลื่อนไหวออกไปด้วย
แม้จะมีการวิจารณ์เหล่านี้ ฉันทามติแสดงให้เห็นว่า Reshaped รักษามาตรฐานคุณภาพที่สูงกว่าเมื่อเปรียบเทียบกับทางเลือกอื่น ๆ ที่มีอยู่มากมาย โดยผู้ใช้ชื่นชมความใส่ใจในการเข้าถึงและการจัดตำแหน่งระหว่างดีไซน์และวิศวกรรม
ปัญหาของคอมโพเนนต์ที่ระบุได้
- Slider: ปัญหาพฤติกรรมการชนกันของแฮนเดิลคู่
- Autocomplete: ฟังก์ชัน Backspace ใช้งานไม่ได้
- Switch: ขาดการโต้ตอบแบบลาก
- แอนิเมชันของ Label: การปรากฏ/หายไปอย่างกะทันหัน
การสร้างรายได้ในอนาคตผ่านคอมโพเนนต์พรีเมียม
การเปลี่ยนไปสู่ open source ไม่ได้เป็นสัญญาณของการสิ้นสุดการพัฒนาเชิงพาณิชย์ ผู้สร้างได้วางแผนสำหรับแพ็กเกจคอมโพเนนต์พรีเมียมที่จะอยู่บนไลบรารีหลักฟรี คอมโพเนนต์ขั้นสูงเหล่านี้จะมุ่งเน้นไปที่การใช้งาน CSS และ React ที่ซับซ้อนมากกว่าคอลเลกชันเทมเพลตง่าย ๆ
แนวทางนี้สะท้อนโมเดลที่ประสบความสำเร็จในพื้นที่ระบบดีไซน์ ที่ฟังก์ชันหลักยังคงฟรีในขณะที่คอมโพเนนต์เฉพาะทางและซับซ้อนสร้างรายได้ กลยุทธ์นี้สามารถให้เงินทุนที่ยั่งยืนสำหรับการพัฒนาต่อเนื่องในขณะที่รักษาเครื่องมือที่จำเป็นให้เข้าถึงได้สำหรับนักพัฒนาทุกคน
การย้ายไปสู่ open source เป็นตัวแทนของความเสี่ยงที่คำนวณแล้วหลังจากการพัฒนาแบบปิดมาหลายปี แต่การมีส่วนร่วมของชุมชนในช่วงแรกแสดงให้เห็นศักยภาพที่แข็งแกร่งสำหรับการปรับปรุงแบบร่วมมือและการยอมรับที่กว้างขึ้นทั่วระบบนิเวศ React
อ้างอิง: Reshaped is now open-source