How to manage JavaScript and PHP injects but compresed?

I have also PHP injects inside JavaScript, but need compressed file.

How to manage PHP and min. JavaScript file? If it is pure JS file it is easy but Javascript contains also PHP injects inside JavaScript format.

An example:

      var temp = '<?php echo $data; ?>';

That was a lot of word salad.

What are you trying to do?

This is something done in the 80th but noadays you should never ever mix up JavaScript and PHP

1 Like

If you compress JavaScript file inside JS file, it is easy (.js). But if you try to compress JavaScript format which contains PHP, it is not pure JavaScript anymore. So, how to manage and get JS file into one row? can be used a tool for this option?

If you compress JavaScript file inside JS file, it is easy (.js). But if you try to compress JavaScript format which contains PHP, it is not pure JavaScript anymore. So, how to manage and get JS file into one row? Can be used a tool for this option which detects PHP injects?

So you want to minify your Javascript. Which contains a php line.
There’s no change. neither php nor javascript care about extraneous white space.

Thank you for the message. I will test a tool as output is formatted regardless of input.

I have tested and it is like I thought. If there is pure JavaScript programming code it will be compressed. An example: https://jscompress.com/
But if you put programming code compressor tools can not decide what are injects. Can be solved this option using PHP code for the compressed code?

An example for injects error: Unexpected token: operator «<» (line: 102, col: 52)

         const htmlInjects = `
         <div>
         <h5 class="">Enrollment</h5>
         <p class=""><b>Price : </b>${budget} &usd;</đ>

The solution to your issue here is to stop trying to mix your PHP and JavaScript code. Write pure JavaScript code, and access whatever data you need from PHP another way (fetch, data attributes, hidden inputs, etc).

2 Likes

Well if you compress a template literal, you’ll erase the line breaks. Which should again be fine because HTML doesnt care about whitespaces either.

Dunno what the upside down p is doing there; and I cannot debug a code compressor tool i dont create or manage.

I get the impression this is you wanting someone to wave a magic wand and say “push this button and it will all work” when its just not that simple. As has been pointed out at least twice now, your problem may be more fundamentally what you’re putting where and how you’re going about accessing it, rather than whether or not it’s got a couple of extra \r\n’s in it.

Yes, it will be solved as pure JavaScript. Thank you for the message!

Agreed. Mixing your JS and PHP has the potential to be a nightmare for debugging and testing your code. In my opinion a horrible idea.

This is only rushed as I am off out the door, but why not fetch your data from PHP in JSON format. Something like this.

// Template for your HTML
const createUserHTML = function (props) {
  const { name, email, website } = props;
  
  return `
    <div>
      <h2 class="name">${name}</h2>
      <p class="email"><b>Email :</b> ${email}</p>
      <p class="website"><b>Website :</b> ${website}</p>
    </div>
  `;
}

// fetch JSON data from your PHP
const fetchUser = async function (id = 1) {
  const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`);
  return response.json();
}

const renderUser = async function(id) {
  const userContainer = document.querySelector('#user');
  // fetch the PHP data
  const userData = await fetchUser(id);
  // create the HTML
  const html = createUserHTML(userData);
  // could the HTML be compressed at this point if really required?

  // render to page
  userContainer.insertAdjacentHTML('afterbegin', html);
}

renderUser(2)