איך עושים איחוד קבצים לטעינה מהירה יותר של אתר?

[DH778]

איך עושים איחוד קבצים לטעינה מהירה יותר של אתר?

היי, יש לי קבצי CSS וקבצי JS "רגילים" ועם סיומת MIN, והם נמצאים בתיקיות נפרדות, חלק מהקבצים הם מוכנים והורדו מהרשת כלומר - פלאגנים, וחלק אני יצרתי מאפס, השאלה שלי, האם אפשר לאחד את הקבצים ולא תהיה בעיה?
אני לא מתעסק עם אתרים ותיכנות ביום יום, אז אני מקווה שיהיה קל לטפל בזה.

 

[חננה013]

לא אמורה להיות בעיה

שלום וברכה,

בקבצי CSS אני עושה את זה לפעמים וזה ממש לא בעיה. שים לב לשים את הCSSים של הפלאגינים לפני הCSSים שלך, כדי ששלך ידרסו את שלהם במידת הצורך (עניין של משקלי סלקטורים).
לגבי JS - לא ניסיתי, אבל לכאורה גם כאן אמור לעבוד תקין.

אם אתה משתמש במערכת וורדפרס - ישנם פלאגינים שיעשו את העבודה בלחיצת כפתור, כולל minify לקבצים באופן אוטומטי, ולך יישאר רק לוודא שהאתר לא "נשבר" מהתנגשויות JS. לדוגמה הפלאגין autoptimize.

 

[DH778]

רק איך עושים? יוצרים קובץ חדש?

"שים לב לשים את הCSSים של הפלאגינים לפני הCSSים שלך, כדי ששלך ידרסו את שלהם במידת הצורך (עניין של משקלי סלקטורים)."

אתה יכול להסביר לי את המשפט הזה? כי לא כל כך הבנתי אותך, אם הפלאגנים נמצאים לפני, ואז שלי, אז איך זה אמור לדרוס?
אתה מתכון שהכל צריך להיות בקובץ אחד? - פלאגנים בראש המסמך ואז מתחת השאר?

 

[חננה013]

נורא פשוט

כרגע מוגדר לאתר לקחת מהשרת מספר קבצי CSS ומספר קבצי JS. אנחנו רוצים למנוע את זה, ולכן ניצור קובץ CSS חדש, ולתוכו נכניס אחד אחד את קודי הCSS מכל קבצי הCSS שנטענים כרגע בנפרד. לאחר מכן ניצור קובץ JS שלתוכו נכניס את כל קודי הJS מכל קבצי הJS שנטענים.
בשלב הבא - נסיר את הקריאה למשאבי הCSS/JS, במקומם נקרא רק לקבצי הJS והCSS החדשים שיצרנו.

לגבי מה שכתבתי על הסדר - אם יש שתי סלקטורים באותו משקל - שלך ושל פלאגין - מי שכתוב מאוחר יותר הוא זה שדורס את המוקדם יותר. לכן אני ממליצה לך לשים בקובץ הCSS שלך קודם את קודי הCSS של הפלאגינים ורק אחר כך את הCSS מהקבצים שלך, כך שלך ידרוס ולא להיפך (שוב, במידה ומדובר במשקל זהה של סלקטורים).
כבר שמתי כאן בעבר קישור לפוסט שכתבתי בנושא של משקלי סלקטורים, הנה הוא שוב
בהצלחה רבה

 

[DH778]

אחרי שראיתי את ההסבר שלך הבנתי,תודה רבה

גם הקישור ששמת הוא כתוב בצורה פשוטה וקל להבנה, השכלתי, תודה רבה