2D platforms can developed without a client-side (local)server ?

[vmars316]

Hello & Thanks ,
I want to make a simple 2d shooter game . 
Actually , I made one in Enchant.js , but sadly they haven't updated for a long while . Leading me to think it is doomed .
So I have started learning pixi.js . 
Btw: I must says I am quite pleased with the quality of support I have reeceived here at html5gamedevs.com/forum .
The thing I liked about Enchant.js is that it can be played locally without a client-side server .
So here's my question : What other 2d game platforms can be developed without a client-side (local)server ?
Thanks...Vern

[WombatTurkey]

Sorry, but what do you mean when you say a 'client-side (local) server'?

[vmars316]

For instance I consider node.js a client-side server .

I want a game platform/engine that doesn't need a server to run .

Here is an example of a simple game that runs the same online or locally in a browser . http://liesandcowpies.com/testMe/BenghaziGame-Local.zip 

and doesn't need a server .

[mattstyles]

Theres no such thing as a client-side server.

You have a server, which is simply a program that runs on a computer. Often when web developers refer to a server they refer to a program that is bound to a port/s and responds to HTTP requests.

Popular languages include PHP, Ruby, Node, Python, C, .Net, Go, Erlang, Rust. There are many many more.

Client-side is, basically, the browser. When you whack in the URL it makes a request to receive 'something', often it will receive an .html page which has further instructions requesting stuff like images, JS, CSS, other files etc etc. Most browsers also allow you to make requests using the file:// protocol, which, when available, will serve files from the file-system. Due to security (web/browser security) when serving via the file:// protocol you can not (ordinarily) make requests out to the big bad web.

The client runs JS. You can load an .html file, which in turn loads a javascript file, the JS interpreter inside the browser will then interpret and execute that JS. So long as nothing in the HTML or the JS calls for stuff from the web it will run just fine.

Pixi and Phaser are simply JS. So long as you do not make requests for things out in the web, they work just fine served from file://.

JS programs do not require a server to run, they only require an interpreter (an engine, such as V8, Spidermonkey, Nitro or Chakra) to run and your browser has one.

[mattstyles]

For example,

https://www.dropbox.com/s/luosps9lpaacs9p/pixi-image-test.zip?dl=0&preview=pixi-image-test.zip

Unzip and serve index.html from file. Voila, pixi rendered image.

But, as Ivan pointed out in the other thread, this really isnt a good idea.

If you want people to play your game like this then there really is no point in writing it in JS. There are other languages which are just as easy which will bundle their runtime so you dont need the browser, although both node-webkit and electron are do this well for JS (they pretty much include both node and a large part of chrome as the runtime).

[chg]

14 minutes ago, mattstyles said:

Client-side is, basically, the browser. When you whack in the URL it makes a request to receive 'something', often it will receive an .html page which has further instructions requesting stuff like images, JS, CSS, other files etc etc. Most browsers also allow you to make requests using the file:// protocol, which, when available, will serve files from the file-system. Due to security (web/browser security) when serving via the file:// protocol you can not (ordinarily) make requests out to the big bad web.

The client runs JS. You can load an .html file, which in turn loads a javascript file, the JS interpreter inside the browser will then interpret and execute that JS. So long as nothing in the HTML or the JS calls for stuff from the web it will run just fine.

Pixi and Phaser are simply JS. So long as you do not make requests for things out in the web, they work just fine served from file://.

Matt is right about this not being that related to engines/frameworks. He is wrong about things always working just fine... certain browsers (eg. Chrome) have restrictions on WebGL content being served from file:// URLs, these are there for security and can be bypassed at the user's risk (eg. running Chrome with the --allow-file-access-from-files argument telling it not to enforce the restrictions).

I wasn't going to comment (I thought this was well known/understood and easily findable info) but I'm a bit surprised at the answers so far...

[mattstyles]

The canvas renderer doesnt have the context restrictions on file urls, my zip uses that.

Not that I've ever worried about it before.

[vmars316]

2 hours ago, mattstyles said:

For example,

https://www.dropbox.com/s/luosps9lpaacs9p/pixi-image-test.zip?dl=0&preview=pixi-image-test.zip

Unzip and serve index.html from file. Voila, pixi rendered image.

But, as Ivan pointed out in the other thread, this really isnt a good idea.

If you want people to play your game like this then there really is no point in writing it in JS. There are other languages which are just as easy which will bundle their runtime so you dont need the browser, although both node-webkit and electron are do this well for JS (they pretty much include both node and a large part of chrome as the runtime).

Thanks All ;
Sorry about my misuse of terms client-side , server-side , framework , engine , etc. .
Just so I am clear , what do I call the thing that runs at "http://127.0.0.1:57689/" , after I installed node.js ?

So matt , I think what you are saying is that
I can run any main.js/index.js using PIXI.CanvasRenderer instead of webGl ?
And I don't have to use this "http://127.0.0.1:57689/" guy ?
I hope so , because I would like to continue using pixijs .
Especially , since I have purchased the book

So all I have to do is convert the following code to use PIXI.CanvasRenderer , 
and then I don't need "http://127.0.0.1:57689/" or Nodejs ?

Quote

 

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>truth02.png</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            background-color: #FFFFFF;
        }
    </style>
    </head>
<body>

<br>
<img id="truth02id" name="truth02png" src="C:\pixi.js\bin\httppixijs.github.io\images\truth02.png" alt="truth02.png">
<br>
<script src="C:\pixi.js\bin\httppixijs.github.io\images\pixi.min.js"></script>
<script>
//Aliases
// var 
//    resources = PIXI.loader.resources,
//    Sprite = PIXI.Sprite;

//Create a Pixi stage and renderer and add the 
//renderer.view to the DOM
var stage = new PIXI.Container(),
    renderer = PIXI.autoDetectRenderer(600, 400);
    
 // Set the background color of the renderer to a baby-blue'ish color
renderer.backgroundColor = 0x3498db;
document.body.appendChild(renderer.view);

var texture02 = PIXI.Texture.fromCanvas(document.getElementById("truth02id"));

var sprite02 = new PIXI.Sprite(texture02);

PIXI.loader
  .add("truth02")
  .load(setup);
//Define any variables that are used in more than one function

function setup() {
  sprite02.y = 96; 
  stage.addChild(sprite02);
 
  //Start the game loop
  gameLoop();
}
function gameLoop(){
  //Loop this function 60 times per second
  requestAnimationFrame(gameLoop);
  //Move the sprite02 1 pixel per frame
  sprite02.x += 1;
  //Render the stage
  renderer.render(stage);
}
</script>
</body>
</html>

 

Thanks
 

[mattstyles]

Quote

Just so I am clear , what do I call the thing that runs at "http://127.0.0.1:57689/" , after I installed node.js ?

127.0.0.1 refers to your local IP, node is then running a process that is bound to port 57689 i.e. it is listening for HTTP requests and will produce responses (or errors) when it receives them. Mostly I guess people call this a server, but, technically its just a process (a program) bound to a port. Its the same in any language, this is not node-specific.

I suspect your code would work, although I'm not sure if there could be anything else that the browser might restrict.

You might need to change your URL's from absolute to local, i.e. if your HTML is at C:\pixi.js\bin\httppixijs.github.io then you might need to use <img src="images/whatever.png"/>, I suspect it wont matter. You'll probably need to use `fromImage` instead of `fromCanvas` and you might need to manually create a base texture as I've done in the zip, I'm not sure what pixi does for its texture helpers.

In no way am I endorsing this as a way to work as a web developer, but, you wanted to know if its possible and it is (with minor caveats, such as the webgl context and possibly other stuff).