احسان الوندی
3 سال پیش توسط احسان الوندی مطرح شد
9 پاسخ

جلوگیری از حجیم شدن فایل app.js تولیدی توسط laravel mix

با سلام و
با توسعه پروژه های laravel و vuejs اندازه فایل app.js تولیدی توسط laravel mix که شامل همه کدهای جاوا اسکریپت template های VueJS میشه بیشتر میشه.
حالا راهی وجود داره که که مثلا فقط قسمتهای ضروری در app.js ریخته بشن تا حجم فایل بالا نره؟ یا اصلا راه دیگه ای وجود داره؟
@hesammousavi
@juza66
@ali.bayat
@endworld
@developer
@er۷۹ka
@arastoo
@Amiirbazzii


ثبت پرسش جدید
developer
تخصص : برنامه نویس
@developer 3 سال پیش مطرح شد
0

چندتا فایل js ایجاد کنید، یعنی کامپوننت هر صفحه رو فقط توی همون صفحه فراخوانی کنید.
از webpack هم میتونید استفاده کنید تا کدهای استفاده نشده رو پاک کنه


احسان الوندی
تخصص : توسعه دهنده وب
@Alvandi 3 سال پیش مطرح شد
0

@developer
چجور میتونم فایلهای js و کامپوننت های مربوط به vuejs رو جدا کنم و تو هرصفحه فایل مخصوص به همون رو لود کنم؟


developer
تخصص : برنامه نویس
@developer 3 سال پیش مطرح شد
1

اگه با vue cli کار میکنید که خودش این کارو میکنه خودکار
اگه vue رو توی لاراول استفاده میکنید خب کامپوننت هاتون رو یکی یکی توی فولدر کامپوننت‌ها ایجاد کنید بعد توی فایل app.js به تک تک شون آدرس بدید و موقع کامپایل همه رو به جز یکی کامنت کنید تا فقط همون یه کامپوننت mix بشه، همزمان توی فایل webpack هم به ازای هر کامپوننت چندتا خروجی بگیرید، به عبارتی به جای میکس کردن یک فایل app.js چندتا فایل mix کنید جدا جدا


محمدحسن یگانه
تخصص : Full-Stack Web Developer Freel...
@mhyeganeh 3 سال پیش مطرح شد
1

کلا در فضای وب همیشه یک Trade-Off وجود داره بین تعداد ریکوئست ها و حجم ریسپانس هر ریکوئست.
و در هر شرایطی باید بررسی کنید بهترین انتخاب به چه صورت هست.

پیشنهاد شخصی بنده این هست که asset ها یا همون کدهای پکیج ها و کتابخونه ها رو جداگانه در قالب یک فایل (مثلا بنام assets.js) و کدهایی که خودتون بصورت خاص نوشتید رو در قالب یک فایل دیگر (بنام app.js) کامپایل کنید.

حالا شما می تونید فایل دوم یا app.js رو به زیر بخش های کوچک تر هم بشکونید و در هر صفحه یا پنل مشخصی صرفا کدهای مرتبط باهاش رو لود کنید و نه الباقی موارد. اینجوری معمولا تعداد فایل ها بیشتر میشه اما صرفه جویی بسیار خوبی در حجمشون میشه و در مجموع معمولا بهینه تر خواهد بود.


سبحان مولایی
تخصص : برنامه‌نویس وب: Python ::...
@websaz 3 سال پیش مطرح شد
1

سلام می تونید به این شکل کار کنید مثلا فایل های قسمت بلاگ و فروشگاه و ادمین رو جدا کنید.


رایموند
تخصص : مختصص وردپرس - برنامه نویس لار...
@Raymond 3 سال پیش مطرح شد
0

@Alvandi

درود...
من معمولا فایل هایی که بهش نیاز دارم رو فراخوانی می کنم به صورت جدا نه همه فایل ها ...
یه مشکلی که داره از طریق دستورات فایل ها رو نصب می کنم زیادی حجم پروژه بالا می ببره ...


احسان الوندی
تخصص : توسعه دهنده وب
@Alvandi 3 سال پیش مطرح شد
0

@mhyeganeh

حالا شما می تونید فایل دوم یا app.js رو به زیر بخش های کوچک تر هم بشکونید و در هر صفحه یا پنل مشخصی صرفا کدهای مرتبط باهاش رو لود کنید و نه الباقی موارد.

ممکنه راهنمایی بفرمایید فایل app.js رو به چه روشی به فایلهای کوچکتر بشکونم؟

اگه vue رو توی لاراول استفاده میکنید خب کامپوننت هاتون رو یکی یکی توی فولدر کامپوننت‌ها ایجاد کنید بعد توی فایل app.js به تک تک شون آدرس بدید و موقع کامپایل همه رو به جز یکی کامنت کنید تا فقط همون یه کامپوننت mix بشه، همزمان توی فایل webpack هم به ازای هر کامپوننت چندتا خروجی بگیرید، به عبارتی به جای میکس کردن یک فایل app.js چندتا فایل mix کنید جدا جدا

@developer

مطابق فرمایش دوستمون اگه عمل کنم اونوقت با هر تغییر باید یک بار مجدد همه کامپوننت ها comment بشن و کامپوننت مورد نظر رو compile کنم. آیا راه اتوماتیکی وجود داره؟

lazy loading چقدر در خصوص کاهش حجم فایل کمک میکنه؟


محمدحسن یگانه
تخصص : Full-Stack Web Developer Freel...
@mhyeganeh 3 سال پیش مطرح شد
0

شما هر تعداد فایل با پسوند js و با هر نامی می‌تونید ایجاد کنید و کدهای موردنیازتون رو داخلشون بنویسید و پکیج های مختلف رو ایمپورت کنید و ...

در نهایت با استفاده از Laravel Mix و اعمال شرایط و تنظیماتتون در فایل Webpack.mix.js آدرس این فایل ها رو بهش میدید و تعیین می‌کنید که خروجیش به چه صورتی کامپایل و ذخیره بشه.

در نهایت از خروجی ها هم متناسب با شرایطتون استفاده می‌کنید.

جهت آشنایی بیشتر با ساز و کار Laravel Mix هم مستنداتش در وبسایت رسمی لاراول یا سایت رسمی خودش عالیه و مثال های خیلی خوبی دارند:
https://laravel.com/docs/8.x/mixl
https://laravel-mix.com/docs/main/installation


احسان الوندی
تخصص : توسعه دهنده وب
@Alvandi 3 سال پیش مطرح شد
0

@mhyeganeh

جهت آشنایی بیشتر با ساز و کار Laravel Mix هم مستنداتش در وبسایت رسمی لاراول یا سایت رسمی خودش عالیه و مثال های خیلی خوبی دارند:

.

ممکنه راهنمایی بفرمایید فایل app.js رو به چه روشی به فایلهای کوچکتر بشکونم؟

من با laravel mix مشکلی ندارم سوالم در خصوص فایل app.js مربوط به vue بود که چجور به تکه های کوچکتر تقسیمش کنم نه کل فایلهای js کل پروژه رو


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام