Replace markup in file without writing new file

Question

I have HTML markup in a file. I intend picking out that markup, replacing the placeholders in it per the data set, and returning a merged string. I could simply use a server-side template (I did previously) but cannot afford it now as some client-side code requires same markup for front end stuff ie code beyond public/ . Presently, the server just hangs whenever it runs into the exec function and throws nor console.errors nothing.

The code looks like this

 var availableFoodsString = "",
regexCb = function (dataSet, flag, indexPage) {
    return function(match, $1, index) {
        if (indexPage == undefined && dataSet["username"] != undefined) {
            dataSet["username_search"] = dataSet["username"];
        }

        if (dataSet[$1] != undefined) return dataSet[$1];

        else if (flag == "EMPTY") return "";
        else if (flag == "MATCH") return match;
    }
}; 


foodsModel.find({availableToday: true}, function(err, docs) {
    if (err) throw err;

    docs.forEach(function (doc) {
        doc = doc.toObject();
        doc.image = "/images/food/" + doc.name + ".jpg";

        var template = /(<div class="food-menu">(\s*.*)*<\/div>)/gi.exec(fs.readFileSync("public/index.html").toString())[0]
        availableFoodsString += template.replace(/\{\{(\w+)\}\}/gi, regexCb(doc))
    });
}); 

In essence, I need availableFoodsString at the end of the day as an additional value to be rendered to another placeholder ie render({available: availableFoodsString}).

The public/index.html is a normal HTML with this somewhere in between

{{name}}

{{price}}

add to cart

So, some jQuery code also needs this much coveted markup at some point after DOM is fully loaded, while doc from the model contain name and price filler variables.

The foodsModel.find() function is async, yes, but it is called inside the http.createServer function by the database opening connection callback so the variable is definitely loaded at that point.

I have seen some other solutions such as this and related questions but they all either involve imploring some external module from npm, or writing a new file from the matched markup, before replacing and merging into the desired variable. I know there has to be a way to achieve this without any of those.

Answer 1

The problem had to do with my regex. The second parenthesis was guilty of something called catastrophic backtracking . Which means the match was greedy in a way that put the interpreter through hell ie taking back more than needed instead of inversely giving back as needed. I knocked up a few spots on the regex and everything works seamlessly now.

The old code stayed the same, just the regex changed from this:

/(<div class="food-menu">(\\s*.*)*<\\/div>)/gi

to this:

/(<div class="food-menu">(\\s+.*)+<\\/div>)/g

For some reason, the previous regex appeared to match the file string seamlessly, first time I tested it, but was brutally unforgiving once I plugged it in real code.