کتابخانه
three یه کتابخونه جاوااسکریپت متن باز برای ساخت و نمایش گرافیک سه بعدی توی مرورگره. با اون می تونی صحنه، دوربین، نور و مدل سه بعدی رو بدون نوشتن مستقیم کد WebGL روی صفحه بیاری. برای نمایش محصول، لندینگ تعاملی، بازی ساده و تجسم داده خوبه و مجوزش MIT هست.
نسخه رسمی و بدون تغییر، از منبع رسمی با مجوز MIT؛ هش هر فایل با منبع بررسی شده است.
۱۰٫۸ مگابایت· ۷۶۱ فایل· انتشار
SHA-256: b326d5a8b9639e18e3d8debae1c331eaaf426ec703bf218c5ab72b9d6bfa1e94
WebGL خودش یه API سطح پایینه. برای کشیدن یه مکعب ساده باید با شیدر، بافر و ماتریس کلنجار بری و کار خیلی زود پیچیده می شه. کتابخونه three این لایه رو برات مرتب می کنه. با مفهوم هایی مثل صحنه، دوربین، نور، متریال و مش کار می کنی و رندر رو خودش پشت صحنه انجام می ده. یه توسعه دهنده با اسم مستعار mrdoob این پروژه رو شروع کرد و الان از رایج ترین کتابخونه های سه بعدی وبه. مجوزش MIT هست، یعنی توی پروژه شخصی و تجاری می تونی ازش استفاده کنی، فقط متن مجوز رو نگه دار.
اگه می خوای یه محصول رو از همه زاویه ها نشون بدی، مثلا مبل، ساعت یا یه قطعه صنعتی توی فروشگاه اینترنتی، سراغ three برو. برای هدر تعاملی، نمایشگاه مجازی، بازی ساده یا تجسم داده هم جواب می ده. ولی اگه فقط یه سایت معرفی یا وبلاگ داری، لازم نیست سمتش بری. یه عکس خوب یا یه ویدیوی کوتاه کار رو راه می ندازه، سبک تره و روی گوشی های ضعیف هم دردسر درست نمی کنه.
موقع انتخاب و استفاده چند تا نکته رو یادت نگه دار. کتابخونه ماژولاره، پس فقط چیزی رو لود کن که لازم داری. ابزارهای کمکی مثل OrbitControls برای چرخوندن دوربین و GLTFLoader برای خوندن مدل ها از هسته جدان و باید جدا import بشن. برای مدل ها معمولا فرمت glTF انتخاب راحتیه، ولی قبلش حجم مدل و تکسچرها رو کم کن. اندازه رندر رو با تغییر اندازه پنجره هماهنگ کن و منابعی که دیگه لازم نداری رو با dispose آزاد کن، وگرنه حافظه کم کم پر می شه.
یه نکته مخصوص شرایط خودمون هم هست. وقتی اینترنت بین الملل مختل می شه، فایل هایی که از CDN خارجی می گیری ممکنه لود نشن و صفحه ات خالی بمونه. بهتره فایل ها رو روی هاست خودت نگه داری. نسخه های رسمی و بدون تغییر این کتابخونه توی مخزن داخلی ما هم در دسترسه.
برای شروع، این قدم ها رو یکی یکی جلو برو:
توی وردپرس هم مسیر همینه. اسکریپتت رو با wp_enqueue_script فقط توی صفحه ای که لازم داره لود کن، نه توی کل سایت. اول روی یه صفحه آزمایشی تست کن و بعدش روی گوشی هم نگاهش کن.
WebGL فناوری خود مرورگره برای کشیدن گرافیک روی کارت گرافیک، ولی کار باهاش سخت و طولانیه. three یه لایه راحت روش می ذاره که با صحنه، دوربین، نور و مدل کار کنی و درگیر جزئیات سطح پایین نشی. برای همین خیلی ها برای شروع کار سه بعدی توی وب سراغش می رن.
آره. مجوز MIT استفاده تجاری، تغییر و توزیع رو اجازه می ده. فقط باید متن مجوز و اعلان حق نشر رو توی پروژه نگه داری. اگه مدل یا تکسچر هم استفاده می کنی، مجوز اون ها جداست و باید جدا بررسی بشه.
آره، می شه. فایل های کتابخونه رو روی هاست بذار، اسکریپتت رو فقط توی صفحه هایی که لازم داره لود کن و نوع اسکریپت رو module بذار. بعضی افزونه های کش و بهینه ساز ممکنه جاوااسکریپت رو دستکاری کنن، پس بعد از راه اندازی حتما صفحه رو تست کن.
خود کتابخونه بعد از لود شدن هیچ نیازی به اینترنت بین الملل نداره. مشکل وقتیه که فایلش رو از CDN خارجی می گیری. اگه فایل ها و مدل هات روی هاست خودت باشن، سایت توی شرایط محدودیت هم مثل قبل بالا میاد.
آره، جاوااسکریپت پایه لازمه، مثل متغیر، تابع و ماژول ها. لازم نیست ریاضی پیچیده بلد باشی، چون کتابخونه بیشتر محاسبه ها رو خودش انجام می ده. با یه مکعب چرخان شروع کن و بعدش کم کم نور، متریال و مدل اضافه کن.
نام کتابخانه، افزونه یا قالب را بفرستید؛ پس از بررسی، نسخه‌های رسمی آن به مخزن اضافه می‌شود.