what does require.js do

Rohit Bajaj
Rohit Bajaj used Ask the Experts™
In my web application inside a jsp there is a line :
   <script data-main="/code/resources/js/new.js" src="/code/resources/lib/require.js"></script>

what does this line means. And whats the use of require.js
I read somwhere that it is used for optimization. ?

Also sometimes i am getting the following error on loading of my page  :
Uncaught Error: Load timeout for modules : codemirror/lib/codemirror     require.js:8

what could be the reason for this... how can i debug it ?

Here is my new.js file :
require(["jquery", "detect", "utils", "codemirror/lib/codemirror", "codemirror/mode/meta", "codemirror/addon/mode/loadmode", "codemirror/addon/selection/active-line"], function ($, detect, utils, CodeMirror) {

    CodeMirror.modeURL = "codemirror/mode/%N/%N";

    var cm = window.cm = CodeMirror($('#editor').get(0), {
        styleActiveLine: true,
        lineNumbers: !detect.isMobile,

    cm.on("changes", function () {
        if (cm.getValue() !== "") {
            document.getElementById("submit").disabled = false;
        } else {
            document.getElementById("submit").disabled = true;

    var mime = $("#mode option:selected").prop("id");
    $("#mode").on("change", function() {
        mime = $("#mode option:selected").prop("id");
        var mode = CodeMirror.findModeByMIME(mime).mode;
        cm.setOption("mode", mode);
        CodeMirror.autoLoadMode(cm, mode);

    $("#submit").on("click", function(e) {               // on submtting make the editor readonly

        var objectTobeSent = {};
        objectTobeSent.id = null;
        objectTobeSent.title = $("#name").val();
        if (objectTobeSent.title === "") {
            objectTobeSent.title = "Untitled";
        objectTobeSent.mime = mime;//console.log(objectTobeSent.mode);
        objectTobeSent.text = cm.getValue();

        var createURL = document.getElementsByClassName("invisible")[0].dataset.createUrl;

            contentType: "application/json; charset=utf-8",
            url : createURL,
            type: "POST",
            data : JSON.stringify(objectTobeSent),
            success: function(snippet, status, xhr) {
                if (xhr.status !== 201) {
                    alert("Couldn't create code snippet. Please try after sometime");
                } else if (!utils.sendMessage(snippet, objectTobeSent.title, $("#message").val())) {
                    window.location.href = snippet.URL;
            error: function(request, status, error) {

    $("#cancel").on("click", function (e) {

Open in new window

It looks like this require is used in the js... please help me understand the js file also.
Is data-main specific to require.js or there its a general attribute
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Most Valuable Expert 2017
Distinguished Expert 2018
require.js is used to load scripts and modules dynamically - you can read more about it here.

In particular you would want to read these pages to get a handle on what require does



With respect to the error you are having the page on common errors specifically references this here

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial