I made an application in EXTJS, but my technical architect and project manager say we don't want big file, so removed the EXTJS and made in object oriented PHP and JavaScript code, mixing HTML with PHP.

But I don't want to mix HTML and PHP because of bad coding structure and bad coding practice.

What should i do?

  • 1
    You need to (a) put a decent question at the top of the post and (b) use proper punctuation (capital letters, and the like). – Frank Shearar Mar 25 '11 at 9:21
  • Have you found your answer? If yes, you should select which answer solved you problem. – Steven Mar 29 '11 at 19:12

You will always have to mix HTML and PHP. Otherwise, how will you fetch dynamic data?

This is how I do it. Let's assume this is index.php file:

  include_once('some.file.php'); // Here you have general functions, classes etc. 
  $result = getSomeResult();

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js?ver=1.4.3" type="text/javascript"></script>
  <script src="js/some_js_script.js"  type="text/javascript"></script>
  Let's output some data gotten from PHP: <br />
  <? echo $result;?>

Now, let's assume the result data is a text box with a button. Clicking this button, you trigger a JSON or EXTJS call. This call will load some more data based on the parameters you pass in. We call this file java.js:

        jQuery.post("http://yoursite.com/include/jquery.php", { var1: 'some value', var2 : 'some more value'},
            jQuery('#text_box').html("new content: " + data);

And as Evan says, load libraries from Google rather than from local server. This will speed up loading time.

You should also have a look at Wordpress if you are in need of using a CMS / templates.

  • 1
    You absolutely don't have to mix HTML with PHP. There's been a significant move away from that in recent years. The main alternative is to use some other contemplating language instead of PHP, and just use PHP to pass variables to it. The templates can be interpreted on the server side, e.g. Twig, Smarty, Blade etc, or on the client side, e.g. Vue, Moustache, Handlebars etc. – bdsl Sep 25 '18 at 19:12
  • Mixing php with html is a bad practice and by no means that's the way to go. – cibercitizen1 Apr 11 at 10:19

It seems that you're looking for template engines, which enables you to have separate PHP and HTML, being able to modify one without modifying another.


You could make the php separately and just require xxxxx.php and only thread your HTML with a few function calls here and there

  some text<hr>
  <? callPosts(); ?>
  <hr>more text

It really isn't too bad to mix in a bit of PHP especially on simpler sites. You could check out NOLOH, it is fairly lightweight. Then you wont even mess with HTML and they can probably still get the result they want.


Use the Google Libraries API to load ExtJS

You don't need to host libraries like ExtJS or jQuery anymore because Google will for you.

The benefit of this are:

  • Lots of sites use this service so, when your page requests the library chances are that it's already in the webcache on the clients computer anyway

  • Because the library is hosted on a domain other than the one your site is on, the browser will allocate another more download slots (IE has a 2 slot max per domain if I remember). This means that you get virtually no degraded performance during page loads (except overall bandwidth usage) when you use libraries like ExtJS and jQuery.

  • You no longer need to host the library on your servers (which defeats your architects argument)

Chances are... if your technical lead is worried about the added size of extjs he probably doesn't know much about optimizing website for performance as using Google Libraries to host common APIs for web development is a pretty common. Any competent webapp architect should know about it by now.


For directions on how to use the API, read this first.

  • i included this in script tag ajax.googleapis.com/ajax/libs/ext-core/3.1.0/ext-core.js but the error is ocming showing that Ext is not defined – WebDev Mar 25 '11 at 9:13
  • It's not quite that simple. You need to sign up for a key first (it's free, they just use it to track for errors), then you need to load the Google Libraries API with, "<script type="text/javascript" src="google.com/jsapi?key=INSERT-YOUR-KEY"></script>" then you load the library with "google.load("ext-core", "3.1.0");" within the <script> block. Follow the link in my update for more detailed instructions. – Evan Plaice Mar 25 '11 at 9:21
  • can't i do it on my local server ? – WebDev Mar 25 '11 at 9:22
  • @Rahul You'll need an internet connection to use it but otherwise, yes you can use it on your local server. – Evan Plaice Mar 25 '11 at 9:23
  • then for key what the url i need to give ? – WebDev Mar 25 '11 at 9:24

ExtJS, jQuery, Javascript code etc should be in their own files. What I do is create HTML with a template package like Smarty. Data gets passed between PHP and ExtJS via ajax class sending data normally in JSON format (though You can use XML if you like).

Your Answer

