0

My PHP template looks like this:

$html=file_get_contents("/path/to/file.html");
$replace=array(
"{title}"=>"Title of my webpage",
"{other}"=>"Other information",
...
);
foreach(replace AS $search=>$replace){
    $html=str_replace($search,$replace,$html);
}
echo $html;

I am considering switching to a javascript/ajax template system. The AJAX will fetch the $replace array in JSON format and then I'll use javascript to replace the HTML.

The page would then be a plain .html file and a loading screen would be shown until the ajax was complete.

Is there any real advantages to this or is the transition a waste of time?

A few of the reasons I think this will be beneficial:

  • Page will still load even if the Mysql or PHP services are down. If the ajax fails I can handle it with an error message.
  • Bot traffic (and anything else that doesnt run JS) will cause very little load to my server since the ajax will never be sent.

Please let me know what your thoughts are.

3 Answers 3

1

My 2cents is it is better to do the logic on the template side (javascript). If you have a high traffic site you can off load some of the processing to each computer calling the site. Maybe less servers.

With Javascript frameworks like AngularJs the template stuff is pretty simple and efficient. And the framework will do caching for you.

Yes, SEO can be an issue with certain sites. There at proxy tools you can put in place that will render the site and return the static html to the bot. Plus I think some bots render javascript these days.

Lastly, I like to template on the front-end because I like the backend to be a generic data provider (RESTful API). This way I can build a generic backend that drives web / mobile and other platforms in a generic way. The UI logic can be its separate thing in javascript.

But it comes down to the design needs of your application. I build lots of Software as a service applications so a single page application works well for me.

Sign up to request clarification or add additional context in comments.

Comments

0

I've worked with similar design pattern in other projects. There are several ways to do this and the task would involve managing multiple project or application modules. I am assume you are working with a team of developers and not using either PHP or JavaScript MVC framework.

PHP Template

For many reasons, I'm against using “search and replace” method especially using server-side scripting language to parse HTML documents as a templating kit.

Why?

  1. As you maintain business rules and project becomes larger, you will find yourself reading through a long list of regular expressions, parse HTML into DOM, and/or complicated algorithms for searching nodes to replace with correct text(s).
  2. If you had a placeholder, such as {title}, that would help the script to have fewer search and replace expressions but the design pattern could lead to messy sharing with multiple developers.
  3. It is ok to parse one or two HTML files to manage the output but not the entire template. The network response could be slower with multiple and repetitive trips to server and that's just only for template. There could be other scripts that is also making trips to the server for different reason unrelated to template.

AJAX/JavaScript

Initially, AJAX with JavaScript might sound like a neat idea but I'm still not convinced.

Why?

  1. You can't assume web browser is JavaScript-enabled in every mobile or desktop. You might need to structure the HTML template in few ways to manage the output for non-JavaScript browsers. You might need to include <noscript> and/or <iframe> tags on every page. And, managing alternative template for non-JavaScript browser can be tedious.
  2. Every web browser interpret JavaScript differently. Most developers should know few differences between IE, FireFox, Chrome, Safari, and to name few. You might need to create multiple JavaScript files to detect then load JavaScript for that specific web browser. You update one feature, you have to update script for all web browsers.
  3. JavaScript is visible in page source. I wouldn't want to display confidential JavaScript functions that might include credentials, leak sensitive data about web services, and/or SQL queries. The idea is to secure your page as much as possible.

I'm not saying both are impossible. You could still do either PHP or JavaScript for templating.

However, my “ideal” web structure should consist of a reliable MVC like Zend, Spring, or Magnolia. Those MVC framework include many useful features such as web services, data mapping, and templating kits. Granted, it's difficult for beginners with configuration requirements to integrate MVC into your project. But in the end, you could delegate tasks in configurations, MVC concepts, custom SQL queries, and test cases to developers. That's my two cents.

Comments

0

I think the most important aspects you forgot are:

  • SEO : What about search engine bots ? They wont be able to index your content if it is set by javascript only.
  • Execution and Network Latency : When your service is working, the browser will wait until the page is loaded (let's say 800ms) before making the extra Ajax calls to get your values. This might add an extra 500ms to get it (depending on network speed and geographic location...). If you have sent all the generated data by your server, you would have spent only ~1ms more to prepare the complete response. You would have a lot of waiting on a blank page.
  • Caching : You could cache the generated pages on your web app. That way your load will be minimized as well. And also, if you still want to deliver content while your backend services (MySQL/PHP..) are down you could even use Apache or Nginx caching.

But I guess it really depends on what you want to do.

For fast and simple pages, which seems to be your case, stick with backend enhancements.

For a dynamic/interactive app which can afford loading times, and doesn't care about SEO, you can delegate most things to the front-end. But then use an advanced framework like Angular, to handle templating, caching, etc...

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.