Sokan Academy

نکاتی که رعایت آن‌ها در حین توسعهٔ وردپرس الزامی است

نکاتی که رعایت آن‌ها در حین توسعهٔ وردپرس الزامی است

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

نوشتن کلیهٔ کدهای جاوااسکریپت مربوط به قالب سایت در یک فایل
در بسیاری از قالب‌های وردپرس، حتی نسخه‌هایی که توسط شرکت‌های بزرگ طراحی شده‌اند، ممکن است این اشتباه وجود داشته باشد. نوشتن تمامی‌ کدهای جاوااسکریپت در یک فایل با نام‌هایی مثل main.js و یا theme.js مستقیماً تأثیر منفی روی سرعت لود سایت دارد. در برخی موارد با افزایش کدها ممکن است حجم نهایی فایل‌های جاوااسکریپت به 1 مگابایت هم برسد در صورتی که شاید در یک صفحهٔ خاص نیاز به لود تنها ٪10 از کدهای آن فایل باشد.

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

به خاطر داشته باشیم که جدا کردن اسکریپت‌های هر صفحه امکان استفاده از توابعی نظیر ()wp_dequeue_script را فراهم می‌کند که در نتیجهٔ آن، کدهای مربوط به هر صفحه تنها در همان صفحه فراخوانی می‌شوند و این کار موجب افزایش پرفورمنس و در نتیجه بهبود تجربهٔ کاربری می‌شود.

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

استفاده از پیشوندهای مناسب می‌تواند راه‌حل خوبی برای جلوگیری از مشکلاتی از این دست باشد. همچنین اگر با چگونگی استفاده از Namespace در PHP آشنایی داشته باشید، استفاده از آن‌ها نیز می‌تواند در زمینهٔ نام‌گذاری بسیار سودمند باشد (از نسخهٔ پی‌اچ‌پی ۵.۳ به بعد فیچری به این زبان اضافه شد تحت عنوان Namespace که این امکان را در اختیار دولوپرها قرار می‌دهد تا کلاس‌هایی با نام‌های مشابه در یک پروژه ایجاد کنند اما در عین حال اختلالی در سیستم ایجاد نگردد.)

عدم استفاده از امکانات پیش‌فرض و کِرنِل وردپرس
بسیاری از افزونه‌هایی که نصب می‌شوند امکاناتی را برای دولوپر فراهم می‌کنند که وردپرس به صورت پیش‌فرض نیز آن‌ها را ارائه ‌می‌کند! این کار نه‌ تنها موجب افزایش حجم فایل‌های وب‌سایت می‌شود، بلکه در آینده اگر برای افزونه‌های نصب‌شده آپدیتی ارائه نشود، دولوپر از امکانات جدیدتر محروم می‌شود که با توجه به این موارد، توصیه می‌شود تا آنجا که امکان دارد از امکانات پیش‌فرض وردپرس استفاده شود تا نه تنها پارامترهای مهمی نظیر سرعت و امنیت در بهترین حالت ممکن باشند، بلکه امکان استفاده از آپدیت‌ها نیز به راحتی فراهم باشد.

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

10 مورد از بهترین پلاگین‌های مورد استفاده در سایت‌های وردپرسی
معرفی ۵ پلاگین کاربردی برای بکاپ‌گیری از سایت‌های وردپرسی
با استفاده از این پلاگین‌ها، از یک سایت وردپرسی حرفه‌ای برخوردار شوید
پلاگین‌های مفید وردپرس برای مدیریت کاربران

در نظر گرفتن مقدار TRUE برای متغیر WP_DEBUG
WP_DEBUG برای جلوگیری از نشان دادن خطاها به صورت پیش‌فرض false در نظر گرفته شده است و بدین ترتیب مواردی مثل مسیر فایل‌ها در پیام‌های خطا برای عموم نشان داده نمی‌شود اما هنگام کدنویسی و ایجاد تغییرات بهتر است که این مقدار true در نظر گرفته شود تا تمامی خطاها و هشدارها برای دولوپر نشان داده شوند. مسلماً برطرف کردن این خطاها ،حتی اگر تأثیری هم در عملکرد سایت نداشته باشند، باعث می‌شود کد بهتر و تمیزتری داشته باشیم.

در نظر نگرفتن چگونگی اجرا شدن صفحه در حالت کَش مروگر
یکی از ایراداتی که حتی گاهی‌ اوقات در کدهای دولوپرهای حرفه‌ای نیز دیده می‌شود، نوشتن توابع و روابط بین آن‌ها به گونه‌ای است که اجرا شدن برخی از کدها وابسته به اجرا شدن دیگر فانکشن‌ها است. برای مثال، می‌توان یک فانکشن پی‌اچ‌پی را در نظر گرفت که مرتبط با مقدار User Agent پروتکل HTTP است که در چنین مواقعی چنانچه کاربر از افزونه‌هایی مثل W3 Total Cache یا WP Rocket استفاده کند، این احتمال وجود دارد که در عملکرد صفحه اختلال ایجاد شود.

فراخوانی بی‌دلیل فایل‌های CSS و JS
یک صفحهٔ وب باید به گونه‌ای طراحی شود که برای اجرای آن به کمترین تعداد ریکوئست HTTP ممکن نیاز باشد. فراخوانی بی‌دلیل فایل‌ها علاوه بر تأثیر منفی بر سرعت سایت، احتمال بروز تداخل در عملکرد آن‌ها را نیز افزایش می‌دهد که این مورد هنگام فراخوانی لایبرری‌هایی همچون jQuery بسیار رایج است.

استفاده از پَسوند php. به جای css. و js.
نوشتن کدهای مرتبط با رنگ‌ها و فونت‌ها در فایلی همچون style.php و ذخیرهٔ آن‌ها در دیتابیس و سپس فراخوانی آن با استفاده از کدی مثل آنچه در ادامه مشاهده می‌کنید، می‌تواند تأثیر بسیار بدی بر عملکرد و سرعت یک سایت وردپرسی داشته باشد: 

<link rel='stylesheet' type='text/css' href='css/style.php?ver=1' />

علاوه بر این، نوشتن کدهای CSS در کنار متغیرهای PHP موجب کاهش خوانایی کدها شده و انجام اصلاحات روی آن‌ها را نیز با مشکل مواجه می‌کند.

استفاده از معماری نامناسب
معماری مورد استفاده باید تا حد امکان ساده و قابل‌فهم باشد. به طور مثال، WooCommerce را می‌توان نمونه‌ای موفق از یک معماری خوب در وردپرس دانست. استفاده از قابلیت‌های شیی‌ٔگرایی می‌تواند راه‌حلی مناسب برای جلوگیری از پیچیده شدن کدها باشد به علاوه اینکه تقسیم کردن کدها در چند فایل با نام‌هایی مثل class.shortcodes.php و class.scripts.php و همچنین استفاده از متدهایی نظیر ()enqueue_public_scripts و ()enqueue_admin_scripts برای فراخوانی آن‌ها، علاوه بر افزایش خوانایی کد می‌تواند سرعت سایت را نیز بهبود بخشد مضاف بر اینکه استفاده ‌از معماری MVC و جدا کردن فایل‌های PHP و HTML به جای نوشتن آن‌ها در کنار یکدیگر، شیوهٔ دیگری از یک معماری مناسب برای توسعهٔ وردپرس است (در همین راستا، می‌توانید به آموزش مقدمه‌ای بر معماری سه‌لایه نرم‌افزاری مراجعه نمایید.)

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

در مباحث مرتبط با امنیت وردپرس، بررسی و پاک‌سازی دیتای ورودی دارای اهمیت زیادی است. یک تابع رایج برای بررسی دیتا ورودی ()sanitize_text_field است که مواردی مثل کدهای نامعتبر UTF-8، تبدیل کاراکترهایی همچون < به معادل‌های اچ‌تی‌ام‌ال، حذف تمامی‌ تگ‌ها و غیره را هندل می‌کند. برای کنترل داده‌های خروجی مثل نسخهٔ پرینت نیز می‌توان از ()esc_url استفاده کرد به طوری که این تابع کاراکترهای مخرب را حذف می‌کند و به این ترتیب موجب افزایش امنیت سایت می‌شود.

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

http://example.com/wp-admin/post.php?post=123&action=trash

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

http://example.com/wp-admin/post.php?post=123&action=trash&_wpnonce=b192fc4204

در این صورت، آدرس صفحهٔ حذف مطلب مشابه با لینک بالا خواهد بود و این در حالی است که اگر کاربر دیگری بخواهد از آن استفاده کند، ارور 403 Forbidden برای وی نشان داده می‌شود.

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

نتیجه‌گیری
گاهی اوقات پیش می‌آید که دولوپرها از وردپرس به عنوان یک پلتفرم بک‌اند برای یک اپلیکیشن موبایل و یا وب سرویس استفاده می‌کنند که در چنین مواقعی پای مفهومی تحت عنوان سی‌ام‌اس‌های به اصطلاح Decoupled به میان می‌آید که برای کسب اطلاعات بیشتر در این زمینه، توصیه می‌کنیم به مقالهٔ Headless CMS چیست؟ مراجعه نمایید. همچنین اگر بر سر دوراهی هستید که آیا باید از سیستم‌های مدیریت محتوای اپن‌سورسی همچون وردپرس استفاده نمایید تا خود اقدام به توسعهٔ یک سی‌ام‌اس نمایید، توصیه می‌کنیم به مقالهٔ توسعهٔ سی‌ام‌اس اختصاصی یا استفاده از نمونه‌های اپن‌سورس؟ مراجعه نمایید.

حال نوبت به نظرات شما می‌رسد. فکر می‌کنید با دنبال کردن چه استراتژی‌های دیگری می‌توان امنیت‌ سایت‌های وردپرسی را افزایش داد؟ نظرات، دیدگاه‌ها و تجربیات خود را با سایر کاربران سکان آکادمی به اشتراک بگذارید.

این محتوا آموزنده بود؟
سی‌ام‌اسوردپرس

sokan-academy-footer-logo
کلیه حقوق مادی و معنوی این وب‌سایت متعلق به سکان آکادمی می باشد.