جاوا اسکریپت (JavaScript) چیست؟

جاوا 

اسکریپت (JavaScript) چیست؟ مقدمه به معرفی جاوا اسکریپت می پردازیم . پاره ای با کاربردهای آن آشنا می شویم . آنگاه به یادگرفتن جاوا اسکریپت می پردازیم و با استفاده از آموزش های چهره یی ارائه شده ، همه مطالب را در موضوع javascript فراگیری می بینیم . به این ترتیب در حالتی که توضیحات زیر را اکنون درک نکردید نگران نباشید . چرا که تنها برای آشنایی اول شما با این لهجه برنامه نویسی کاربردی است . 

طراحی سایت در مشهد

جاوا اسکریپت ، یک لهجه برنامه نویسی هست که قابلیت و امکان تعامل با صفحه های اینترنت را مهیا می سازد (برای نمونه ، بازی ها ، جواب هایی که در هنگام فشار دادن کلید ها یا وارد کردن داده ها در فرم ها ، ارسال می شوند ، برنامه کودک ها و . . .) . 

فراگیری جاوا اسکریپت مسیری میباشد به سوی پباده سازی صفحات اینترنت جذاب خیس و کاربرپسندتر . جاوا اسکریپت برای او‌لین بار بوسیله شرکت Netscape و با نام LiveScript به دنیای وب و بازار عرضه شد . البته ابعاد ، با حمایت کمپانی Sun Microsystems (پدید آورنده JAVA) با نام جاوا اسکریپت شناخته شد . جاوا اسکریپت یک گویش اسکریپت نویسی است ، که اکثر با کدهای HTML در رابطه میباشد و همانند کدهای HTML ، روی پلت فرم های مختلفی اجرا می شود ، و یا این که به عبارتی به وسیله مرورگر های اینترنت مختلفی ، قابل تعبیروتفسیر هست . 

JavaScript (به اختصار JS) ، لهجه برنامه نویسی کاملاً پویا هست ، که هنگامی به یک برگه وب ، اعمال می شود ، قابلیت و امکان برقراری تعامل پویا با اینترنت وب سایت را مهیا می سازد . 

جاوا اسکریپت ، گویش برنامه نویسی عده و جوری هست ، البته با این اکنون ، زیاد انعطاف پذیر می‌باشد . بسط دهندگان ، گونه های متنوعی از ابزارها را بر روی هسته گویش JavaScript ، متن اند و تعداد زیادی امکان های مازاد را برای آن آماده نموده اند . 

بعضا از این قابلیت ها عبارتند از : 

Browser Application Programming Interfaces (APIs) : API های ساخته گردیده در باطن مرورگرهای اینترنت ، قابلیت و امکان هایی مثل ساخت پویایی در صفحه ها و پیکربندی CSS Style ، ایجاد گرافیک های سه بعدی و sample های صوتی ، را فراهم می نمایند . 

API های third-party ، که برای گسترش دهندگان این اجازه را می دهند که عملکردهای تارنما خویش را با بقیه تولیدکنندگان محتوا ، مثل توییتر و صورت بوک ، مخلوط کنند . 

چارچوب ها و کتابخانه های third-party در جاوا اسکریپت ، که می بضاعت و توان از آن‌ها در کدهای HTML ، استفاده نمود ؛ تا بتوان تارنما ها و برنامه های کاربردی را با سرعت بیشتری ایجاد . 

سرعت بارگذاری و بارگذاری اینترنت سایت سرعت لود

ب) 

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

برای این مراد ارزیابی مولفه های زیرضروری می‌باشد : 

طراحی سایت در مشهد

سرعت بارگذاری و بارگذاری اینترنت سایت سرعت لود به معنای بازه زمانی هنگامی می‌باشد که وب سایت به طور بی نقص لود و قابل استعمال شده می باشد . توجه به این نکته که یوزرها به هیچ وجه مایل نیستند مدت متعددی را برای لود یک تارنما صرف کنند، مقدار اهمیت این مولفه را صریح می سازد . می توانید با به کارگیری از تکنیک های برنامه نویسی و طراحی وب، بهره گیری از لهجه برنامه نویسی مناسب، گزینش پهنای باند مناسب، کاهش حجم تصاویر و به حداقل رساندن موادسازنده گرافیکی و اسکریپت ها تاثیر شایانی در ارتقا سرعت بار گذاری صفحات اینترنت خود داشته باشید . 

جهت تحلیل سرعت سایت، می توانید از اینترنت وبسایت های آنلاین مثل سایت gtmetrix .com استعمال کنید . 

سئو وب سایت با صرفه سازی و سئو وب سایت بخش مهمی از پباده سازی وب میباشد . سئو را می ‌توان گروه ‌روش ‌هایی برای تغییر استراتژیک وب سایت ‌ها دانست . این فرآیند به بیان مهمترین عامل ها دارای ارتباط کاغذ و افزایش اهمیت آن در نتایج جستجو می‌پردازد . اینترنت سایت شما می بایست برای موتورهای جستجو بهینه شود . برای این مراد در حین طراحی یک سایت، طراح یا مدیر وب سایت بایستی با رعایت استانداردهای سئو، وب سایت خویش را برای موتورهای جستجو که مرجع با اهمیت هدایت کاربران به تارنما هاست، بهینه کند . 

جهت اطلاعات عمده به مطلب فراگیری جامع و کامل سئو سایت (SEO) مراجعه نمائید . 

باصرفه سازی برای مرورگرها هنگام طراحی سایت مطمئن گردید که تارنما شما با تمام مرورگرهای تازه و قدیم سازگار باشد . جهت عدم از دست دادن کاربرانی که با مرورگرهای مختلف از تارنما شما بازدید می کنند، هیچوقت وبسایت خویش را تنها برای یک یا دو مرورگر تنظیم نکنید . بطور مثال در جمهوری اسلامی ایران رسم می باشد که تارنما ها را برای مرورگرهای اکسپلورر 6 تا 9 و فایرفاکس و کروم و اپرا تنظیم می کنند . 

نکات 

پایانی مطالب وب تارنما خویش را به طور منظم به روز رسانی نمایید . مزیت این عمل علاوه بر جذب کاربران، بهبود سئوی اینترنت وب سایت هست چرا که موتورهای کاوش به مطالب نو واکنشی خاص نشان می دهند . 

از به کار گیری پیوند های متعدد جهت رسیدن به صفحه های یگانه اجتناب فرمائید . کاربران مایل نیستند از لینک های مکرر جهت رسیدن به هدف استفاده نمایند . 

پباده سازی وبسایت را به نوع ای انجام دهید که با حداقل کلیک، دستیابی سهل وآسان به زمینه امکانپذیر باشد . این نکته زیاد اصلی می‌باشد . کلیک کردن بسیار و تورفتگی های عمیق مطالب سبب می شود که بازدیدکنندگان سایت را کنار گذاشتن کنند . 

از به‌کارگیری عکس به ‌جای متن اجتناب کرده و برای تمام تصاویر توضیحی درج کنید که در صورت عدم بار گذاری تصاویر، بازدیدکنندگان با خواندن توضیح از زمینه آن آگاه شوند . 

از ایجاد صفحه های غیرقابل برگشت بپرهیزید . عدم وجود لینک بازگشت به برگه اصلى و صفحات دیگر سبب ساز آزردگی کاربران می شود . 

سایت شما می باید براى تمام کاربران اینترنت (نه فقط متخصصین) قابل به کار گیری و گشت زنى باشد . 

سپس از روی فعالیت آمدن سایت، با استفاده از ابزارهای چک همچون گوگل بررسی سعی وبسایت خویش را جهت چک ساختار و روش بهینه سازی وبسایت در موتورهای جستجو باز بینی فرمایید . 

Web Worker چیست؟

Web 

Worker چیست؟ Web Worker (در لغت به مضمون‌ خدمتکار یا این که کارگذار وب) کدهای جاوا اسکریپتی می باشند که در پس موضوع در حالا اجرا شدن هستند، فارغ از این‌که همت و سرعت وب وبسایت ما را مبتلا اختلال کنند . در واقع زمانی که اسکریپت های ما در ورقه ی HTML اجرا می شوند، تا نقطه پایان اجرای اسکریپت، ورقه متوقف می شود و واکنش نشان نمی دهد . 

در طرف مقابل web worker ها میباشند که در پس مسئله اجرا می شوند، از کدهای دیگر غیروابسته می‌باشند و روی عملکرد و سرعت وبسایت هیچ تاثیری نمی گذارند . بنابراین زمانی که web worker ها در درحال حاضر فعالیت هستند، کاربر می تواند هر کاری دوست دارد بکند (کلیک کردن، select کردن و … .) . 

طراحی سایت در مشهد

موقعیت 

پشتیبانی از این خصوصیت در مرورگر های مطرح دنیا به این شرح است: 

مرورگر کروم فایرفاکس اپرا سافاری اینترنت 

اکسپلورر یا این که Edge نسخه 4 .0 3 .5 11 .5 4 .0 10 .0 

در 

مثال پایین یک web worker بی آلایش تولید کرده ایم که ثانیه ها را در پس موضوع می شمارد: 

html> 

Count 

numbers: 

dir='rtl' onclick="startWorker()">شروع به فعالیت web worker  dir='rtl' onclick="stopWorker()">پایان عمل web worker 

هشدار:Internet Explorer 9 و نسخه

های کهن خیس آن از قابلیت web worker ها پشتیبانی نمی کنند .

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

27 

28 

29 

30 

31 

32 

33 

34 

html> 

Count 

numbers: 

dir='rtl' onclick="startWorker()">شروع به فعالیت web worker  dir='rtl' onclick="stopWorker()">پایان عمل web worker 

هشدار:Internet Explorer 9 و نسخه

های قدیمی خیس آن از قابلیت و امکان web worker ها پشتیبانی نمی نمایند .

مشاهده 

ی خروجی در JSBin 

ولی 

همیشه خوب تر است قبلی از عمل با web worker ها از پشتیبانی مرورگر استفاده کننده مطمئن شوید: 

if 

(typeof(Worker) !== "undefined") { 

// Web worker کار می کند! // کد های مورد نظرتان را اینجا بنویسید . 

} 

else { 

// متاسفانه Web worker برای شما عمل نمی کند } 

1 

2 

3 

4 

5 

6 

if 

(typeof(Worker) !== "undefined") { 

// Web worker کار می کند! // کد های موضوع نظرتان را اینجا بنویسید . 

} 

else { 

// متاسفانه Web worker برای شما فعالیت نمی کند } 

تولید 

یک web worker بیایید یک web worker در یک پوشه جاوا اسکریپت (به صورت external) بسازیم . اسکریپت تحت یک شمارش گر می‌باشد و در فولدر demo_workers .js 

قرار داده گردیده است: 

var 

i = 0; 

function 

timedCount() { 

i = i + 1; 

postMessage(i); 

setTimeout("timedCount()",500); } 

timedCount(); 

1 

2 

3 

4 

5 

6 

7 

8 

9 

var 

i = 0; 

function 

timedCount() { 

i = i + 1; 

postMessage(i); 

setTimeout("timedCount()",500); } 

timedCount(); 

قسمت اساسی این کد ()postMessage است که کارش ارسال یک پیام به HTML است . 

نکته: این فقط یک نمونه برای آشنایی شماست . در واقعیت معمولا برای چنین اسکریپت ساده ای از web worker ها استفاده نمی شود بلکه در مواردی زمینه به کارگیری قرار می گیرند که اسکریپت، CPU و توان پردازشی زیادی اشغال نماید . 

حالا که فایل اسکریپت قضیه نظرمان را داریم باید آن را از صفحه ی HTML صدا بزنیم . کد پایین بررسی می کند تا ببیند آیا در هم اکنون حاضر worker ای وجود دارد یا این که خیر . در‌صورتی‌که هیچ worker ای وجود نداشته باشد، یک شیء worker تازه می سازد و کد های فایل demo_workers .js 

را اجرا می کند: 

if 

(typeof(w) == "undefined") { w = new Worker("demo_workers .js"); 

} 

1 

2 

3 

if 

(typeof(w) == "undefined") { w = new Worker("demo_workers .js"); 

} 

هم اکنون می توانیم از طریق web worker پیام هایی را ارسال و اخذ کنیم . 

در اینجا یک event listener از دسته رویداد onmessage را به worker خود بیش تر می کنیم: 

w .onmessage 

= function(event){ document .getElementById("result") .innerHTML = event .data; 

}; 

1 

2 

3 

w .onmessage 

= function(event){ document .getElementById("result") .innerHTML = event .data; 

}; 

زمانی که worker ما پیامی را ارسال کند، event listener اجرا خواهد شد . همچنین داده هایی که از worker ارسال می شوند در event .data ذخیره خواهند شد . 

اما می بایست حواسمان به نکته ای دیگر هم باشد؛ زمانی که شیء web worker ساخته می شود، چه بسا پس از نقطه پایان اجرای اسکریپت، در درحال حاضر گوش دادن (listen) به پیام های نو میباشد مگر اینکه آن را از بین ببریم . 

برای از دربین بردن web worker ها و رها کردن منابع سیستمی استفاده کننده از امر پایین به کار گیری کنید: 

w .terminate(); 

1 

w .terminate(); 

اگر 

پس از حذف worker، متغیر اش را برابر با undefined نمایید می توانید مجدد از کد گذشته به کار گیری کنید: 

w 

= undefined; 1 

w 

= undefined; درحال حاضر 

می توانیم تماما متوجه کد زیر شویم: 

html> 

Count 

numbers: 

dir='rtl' onclick="startWorker()">شروع به فعالیت web worker  dir='rtl' onclick="stopWorker()">پایان کار web worker 

هشدار:Internet Explorer 9 و نسخه

های قدیمی خیس آن از قابلیت web worker ها پشتیبانی نمی نمایند .

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

27 

28 

29 

30 

31 

32 

33 

34 

html> 

Count 

numbers: 

dir='rtl' onclick="startWorker()">شروع به فعالیت web worker  dir='rtl' onclick="stopWorker()">پایان عمل web worker 

هشدار:Internet Explorer 9 و ورژن

های قدیمی خیس آن از امکان web worker ها پشتیبانی نمی نمایند .

مشاهده 

ی خروجی در JSBin 

نکته: 

از آنجایی که web worker ها در فولدر های فرنگی (External) هستند، به شی ءها جاوا اسکریپت ذیل دسترسی ندارند: 

window 

object document 

object parent 

object Server-Sent 

Event چیست؟ Server-Sent Event یا به طور مخفف SSE (در لغت به معنی «رویداد های ارسالی از سمت سرور») به صفحات اینترنت اذن می دهند که به طور اتومات و قلم از سرور بروزرسانی دریافت نمایند . 

این امکان از گذشته نیز در HTML آماده بود البته خودکار فقدان و کاغذ می بایست از سرور سوال می کرد که آیا بروزرسانی جدیدی وجود داراست یا این که نه . مثال های این دسته روی داد ها را در به روز های Facebook و Twitter، تارنما های اعلام نرخ بورس (که به صورت لحظه ای بروزرسانی می شوند)، فید های خبر‌ها و … چشم اید . 

تگ (tag) در اچ تی ام ال چیست؟

اگر 

تن یک آدم را به یک صفحه‌ی اینترنت تشبیه کنیم: 

آغاز بدن بشر با به کارگیری از استخوان ها، اسکلت بندی میشود و ساختار کلی آن معین می شود . 

طراحی سایت در مشهد

بعد 

با به کار گیری از کدهایی مانند CSS، میتوان به آن جذابیت های ظاهری داد (همانطور که کیفیت کدهای CSS یک صفحه‌ی وب متفاوت است،‌ کیفیت کدهای CSS دو انسان نیز می تواند مختلف باشد

طراحی سایت در مشهد

alipour یکشنبه 9 تیر 1398 ساعت 12:19