የ JavaScript ኮድ ማስዋብ እና ማሳነስ ዓላማ
በ JavaScript ሶፍትዌር ግንባታ ሂደት ውስጥ የኮድ አቀማመጥ ቅርጸት ለሰው ልጅ ተነባቢነት እና ለኮምፒውተር አፈጻጸም የተለያየ ሚና አለው። የ JavaScript ማስዋቢያ እና ማሳነሻ መሳሪያ እነዚህን ሁለት የተለያዩ ፍላጎቶች በአንድ ላይ ለማሟላት የተዘጋጀ ነው።
ኮድን ማስዋብ (beautification) በዋናነት ትኩረቱን የሚያደርገው የኮዱን መዋቅር ግልጽ በማድረግ ላይ ነው። በተለይም የተቀነሰ፣ የተደበቀ ወይም በሌሎች ገንቢዎች የተጻፈን ኮድ አቀማመጥ በማስተካከል በቀላሉ ለመረዳት እና ስህተቶችን ለመፈለግ (debugging) ይረዳል። በሌላ በኩል ኮድን ማሳነስ (minification) የፋይሉን መጠን በመቀነስ በድረ-ገጾች ላይ በፍጥነት እንዲጫን ለማድረግ የሚጠቅም የዝግጅት ሂደት ነው።
የኮድ መጠን እና የተነባቢነት ሚዛን
በ JavaScript ልማት ውስጥ በኮድ መጠን እና በተነባቢነት መካከል ቀጥተኛ የሆነ ተቃርኖ አለ። ለሰው ልጅ ተነባቢ እንዲሆን ተብሎ የሚዘጋጅ ኮድ በርካታ ክፍተቶችን፣ አዲስ መስመሮችን እና ገላጭ የሆኑ የተለዋዋጭ (variable) ስሞችን ይይዛል። ይህ አቀራረብ ኮዱን ለመጠገን እና ለማሻሻል የሚረዳ ቢሆንም፣ የፋይሉን መጠን በከፍተኛ ሁኔታ ይጨምረዋል።
በድረ-ገጽ አቅርቦት ላይ እያንዳንዱ ባይት (byte) የጫና ልዩነት ያመጣል። የፋይል መጠን በጨመረ ቁጥር ተጠቃሚው ድረ-ገጹን ለመክፈት የሚፈጅበት ጊዜ ይረዝማል። ስለዚህ ኮዱን ለስራ ዝግጁ (production) በሚደረግበት ወቅት ማሳነስ አስፈላጊ ይሆናል። ይህ ሂደት የኮዱን አሠራር ሳይቀይር መጠኑን እጅግ በጣም አነስተኛ ያደርገዋል።
ባዶ ቦታዎች፣ አስተያየቶች እና የፋይል መጠን
በ JavaScript ፋይል ውስጥ የሚገኙ ባዶ ቦታዎች (whitespace)፣ የመስመር መቋረጫዎች እና አስተያየቶች (comments) ለአሳሹ (browser) ምንም ዓይነት የሥራ ትዕዛዝ አያስተላልፉም። አሳሹ ኮዱን በሚያነብበት ወቅት እነዚህን ክፍሎች ዘልሎ ያልፋል። ሆኖም ግን እነዚህ ቁምፊዎች በፋይሉ ውስጥ ቦታ ስለሚይዙ የፋይሉን መጠን ይጨምራሉ።
ኮድን በማሳነስ ሂደት ውስጥ እነዚህ አላስፈላጊ ክፍተቶች፣ አስተያየቶች እና የማይሰሩ ኮዶች (dead code) ሙሉ በሙሉ ይወገዳሉ። በዚህም ምክንያት የፋይሉ መጠን ይቀንሳል። ነገር ግን የባለቤትነት መብትን ለማሳወቅ የሚረዱ የፍቃድ ሰነድ ባነሮች /*! … */ በማሳነስ ሂደት ውስጥ ሳይጠፉ እንዲቆዩ ይደረጋል።
የተለዋዋጭ ስሞች አያያዝ በማሳነስ ሂደት ውስጥ
የአካባቢ ተለዋዋጮች (local variables) ስም ርዝማኔ በኮዱ አሠራር ላይ ምንም ዓይነት ተጽዕኖ የለውም። ኮድን በሚያሳንሱበት ወቅት እነዚህን ስሞች እንዴት መያዝ እንደሚችሉ ሁለት አማራጮች አሉ፦
- አሳጥር: ይህ አማራጭ የአካባቢ ተለዋዋጭ ስሞችን ወደ አንድ ፊደል በመቀየር ፋይሉ ሊኖረው የሚችለውን አነስተኛ መጠን እንዲይዝ ያደርጋል።
- አቆይ: ይህ አማራጭ ደግሞ የተለዋዋጭ ስሞችን ሳይቀይር እንዳሉ ይተዋቸዋል። በዚህ ጊዜ የፋይሉ መጠን ከቀደመው አማራጭ ጥቂት ባይት ቢጨምርም፣ ኮዱን መልሶ ለማንበብ እና ስህተቶችን ለመመርመር ቀላል ያደርገዋል።
ማሳነስ የኮዱን ይዘት የሚያጠፋ በመሆኑ፣ አንዴ የተለወጡ የተለዋዋጭ ስሞችን ወይም የተሰረዙ አስተያየቶችን ወደ መጀመሪያው ይዘት መመለስ አይቻልም።
የመሳሪያው አጠቃቀም መመሪያ እና ገደቦች
ይህ መሳሪያ እስከ 3,000,000 ቁምፊዎች ድረስ ያለውን የ JavaScript ኮድ ማስተናገድ ይችላል። ኮድዎን በግብዓት ሳጥኑ ውስጥ ካስገቡ በኋላ የሚከተሉትን ተግባራት ማከናወን ይችላሉ፦
- ማስዋብ: ኮዱን ለማስዋብ በሚመርጡበት ጊዜ የክፍተት አይነት (indent style) በ 2 spaces፣ 4 spaces ወይም Tab ማድረግ ይችላሉ።
- ማሳነስ: ኮዱን ለማሳነስ በሚመርጡበት ጊዜ የስም አያያዝን "አሳጥር" ወይም "አቆይ" በማለት መወሰን ይችላሉ።
ሂደቱ በተሳካ ሁኔታ ሲጠናቀቅ ውጤቱ በልዩ የውጤት ሳጥን ውስጥ የሚታይ ሲሆን፣ የውጤቱን መስመሮች፣ ቁምፊዎች እና መጠን በ UTF-8 ባይት ማየት ይችላሉ። እንዲሁም ውጤቱን በቀጥታ ማውረድ ወይም መቅዳት ይቻላል። "አጽዳ" የሚለውን ሲጫኑ የነበረው ግብዓት፣ ውፅዓት እና የተቀመጠ ረቂቅ ሙሉ በሙሉ ይጠፋል።
በማቀናበር ሂደት ውስጥ የሚከተሉት የስህተት መልዕክቶች ሊያጋጥሙ ይችላሉ፦
- የገቡት ቁምፊዎች ከገደቡ በላይ ከሆኑ፡ "ይህ ፋይል ለማቀናበር በጣም ትልቅ ነው። እባክዎ አነስ ያለ ይሞክሩ።" የሚል መልዕክት ይታያል።
- ማቀናበሩ ከ 20 ሰከንድ በላይ ከወሰደ፡ "ይህ በጣም ረጅም ጊዜ ስለወሰደ ቆሟል — እባክዎ አነስ ያለ ፋይል ይሞክሩ።" የሚል ስህተት ይፈጠራል።
- በኮዱ ውስጥ የሰዋስው ስህተት (syntax error) ካለ፡ "ይህን JavaScript ማቀናበር አልተቻለም።" የሚል መልዕክት ይወጣል።
- ከማሳነስ በኋላ ምንም የሚሰራ ኮድ ካልቀረ፡ "ካሳነሱ በኋላ የቀረ ነገር የለም — ግብዓቱ ምንም ሊሰራ የሚችል ኮድ አልነበረውም።" የሚል ማሳሰቢያ ይታያል።
የእርስዎ JavaScript ቅርጸት የሚስተካከለውና የሚቀነሰው በአሳሽዎ ውስጥ ነው። ወደ BroBroGo ምንም ነገር አይሰቀልም።
ተደጋግመው የሚነሱ ጥያቄዎች (FAQ)
በማስዋብ (beautify) እና በማሳነስ (minify) መካከል ያለው ልዩነት ምንድን ነው?
ማስዋብ (Beautify) ኮዱ በቀላሉ እንዲነበብና እንዲመረመር ክፍተቶችንና መስመሮችን ያስተካክላል — ይህም የጠበበ ወይም የተደበቀ ፋይልን ለመረዳት ፈጣኑ መንገድ ነው። ማሳነስ (Minify) ደግሞ ተቃራኒውን ያደርጋል፡ ፋይሉ በፍጥነት እንዲወርድ ባዶ ቦታዎችን፣ አስተያየቶችንና የማይሰሩ ኮዶችን ያስወግዳል። ለማንበብ ያስውቡ፣ ለማሰራጨት ያሳንሱ።
የቀነሰውን ኮድ ወደ መጀመሪያው መመለስ ይችላል?
ክፍተቶችንና የመስመር መቋረጫዎችን ወደ ነበሩበት ይመልሳል፣ በዚህም አመክንዮው (logic) እንደገና ሊነበብ ይችላል፤ ነገር ግን የመጀመሪያዎቹን የተለዋዋጭ ስሞች ወይም አስተያየቶች መመለስ አይችልም — ማሳነስ እነዚያን እስከወዲያኛው ስለሚያጠፋቸው ምንም አይነት መሳሪያ ሊመልሳቸው አይችልም። የሚያገኙት ኮድ ያንኑ ሆኖ በግልጽ የተቀመጠውን ብቻ ነው።
የማሳጠር (Shorten) እና የማቆየት (Keep) የስም አማራጮች ምን ያደርጋሉ?
ሁለቱም ሁነታዎች ባዶ ቦታዎችን፣ አስተያየቶችንና የማይደረስባቸውን ኮዶች ያስወግዳሉ፤ እንዲሁም አንዳቸውም የስክሪፕትዎን ተግባር አይለውጡም። ማሳጠር (Shorten) ፋይሉን በተቻለ መጠን አነስተኛ ለማድረግ የአካባቢ ተለዋዋጮችን (local variables) ወደ አንድ ፊደል ይቀይራል — ይህም ለስራ ዝግጁ የሚሆነው ፋይል ነው። ማቆየት (Keep) ግን ስሞችን እንዳሉ ይተዋቸዋል፣ ስለዚህ ውጤቱ ትንሽ ከበድ ያለ ቢሆንም አሁንም ሊነበብና ስህተቶችን ለመፈለግ ቀላል ይሆናል።
በማሳነስ ሂደት ውስጥ የባለቤትነት መብት ወይም የፍቃድ ስምምነት አስተያየቶች ይጠፋሉ?
መደበኛ አስተያየቶች በሙሉ የሚወገዱ ቢሆንም፣ ልዩ ቅርጸት ያላቸው እና በ /*! … */ የሚጀምሩ የፍቃድ ሰነድ ባነሮች (license banners) በማሳነስ ሂደት ውስጥ ሳይጠፉ እንዲቆዩ ይደረጋል።