Search code examples
javascriptecmascript-next

Loading a Web Page Directly from a JavaScript File Exclusively

I have the desire to do something that I've never seen done.

I'd like to create a web page using only client-side javascript. For example, I want to put a javascript file at www.webpage.com/index.js and have the browser run that javascript file. Within that file, I'll generate html and css, but I'd like the entry point to be exclusively that javascript file instead of HTML.

If this is not possible, I think it should be. Many times my html files are just a header, title and an empty body. When this is the case, it is silly that an html file has to be downloaded first, and then only after that can the browser download the javascript file that actually fills that empty body with content.

I realize that search engines may not know how to index pages where the html is generated by client-side javascript, but again, I say they should be able to do this and probably eventually will if they haven't already.

I've never seen this done. Is this possible? If so, can you please direct me to any resources covering the topic. I couldn't find anything.

Solution

  • As mentioned elsewhere, it's possible to create JavaScript that is also a valid HTML file.

    <!-- --><script>
console.log('Hello, World!');
// </script>

    This works because the JavaScript spec has

    B Additional ECMAScript Features for Web Browsers

    B.1 Additional Syntax

    B.1.3 HTML-like Comments

    ...

    SingleLineHTMLOpenComment ::
        <!-- SingleLineCommentCharsopt