office-engine: ویرایش Word، Excel و PowerPoint تو مرورگر
فرانتاند
ریاکت
جاوااسکریپتخلاصهٔ کامل‌تر
@p10node/office-engine یه پکیج npm با لایسنس MIT هست که فایل‌های DOCX / XLSX / PPTX رو تو مرورگر نمایش می‌ده و ویرایش می‌کنه. مثل Google Docs فایل رو کم‌کم بارگذاری می‌کنه، فایل‌های سنگین رو هم تحمل می‌کنه و نتیجه رو با همون فرمت اصلی ذخیره می‌کنه. پیش‌نیازش React 18 به بالاست.
استفاده‌ش تو React خیلی ساده‌ست. ورودی می‌تونه یه File یا Blob یا ArrayBuffer باشه، یا یه URL که با Range request (یعنی دانلود تیکه‌تیکه‌ی فایل به جای کل اون) خونده میشه:
import { DocViewer } from '@p10node/office-engine'
<DocViewer src={file} style={{ height: 600 }} />
<DocViewer src="https://cdn.example.com/report.xlsx" />
<DocViewer src={file} editable onSave={(blob, name) => upload(blob, name)} />CSS خودش اضافه میشه و فقط باید ظرفش ارتفاع داشته باشه. بدون React هم میشه از web component به اسم ، تابع mount() یا یه فایل اسکریپت تکی استفاده کرد.
سرعتش از چند تا ترفند میاد. فایل ZIP به‌صورت lazy باز میشه و XML تو یه Web Worker (یعنی یه thread جدا از رابط کاربری) به‌صورت streaming پارس میشه، پس UI هیچ‌وقت گیر نمی‌کنه. نمایش هم virtualized هست، یعنی فقط صفحه‌ها و سلول‌ها و اسلایدهایی که رو صفحه‌ان رندر می‌شن. موقع ذخیره هم فقط بخش‌های ویرایش‌شده دوباره ساخته می‌شن و بقیه‌ی فایل دست‌نخورده می‌مونه.
امکانات ویرایش با یه toolbar شبیه Google Docs ارائه میشه: متن و استایل و جدول تو DOCX، سلول و فرمول (134 تابع) و شیت تو XLSX، و متن و شکل و اسلاید تو PPTX. همکاری هم‌زمان با نمایش cursor بقیه، همگام‌سازی ویرایش‌های آفلاین، خروجی PDF و CSV و حالت تاریک با theme="dark" یا "auto" هم داره.
طبق بنچمارک‌های خود پروژه روی Chromium و Apple M-series، یه فایل XLSX با 300 هزار ردیف و 12 ستون (24.8 مگابایت) اولین نمایشش رو حدود 330 میلی‌ثانیه نشون می‌ده و حدود 2 ثانیه کامل بارگذاری میشه. یه DOCX با 20 هزار پاراگراف هم 2073 صفحه رو حدود 2 ثانیه‌ای میاره.
نکات کلیدی:
- پشتیبانی از نمایش و ویرایش DOCX، XLSX و PPTX مستقیم تو مرورگر
- پیش‌نیاز: react و react-dom نسخه‌ی 18 به بالا، لایسنس MIT
- پارس XML تو Web Worker و رندر virtualized برای فایل‌های سنگین
- XLSX با 300 هزار ردیف: اولین نمایش حدود 330ms و بارگذاری کامل حدود 2s
- پشتیبانی از 134 تابع فرمول اکسل و همکاری هم‌زمان چند نفره
- قابل استفاده بدون React با یا mount()
