Script blocks really slowing down Jekyll build times

Help
1

Build times for about 110 pages of content with 2 script blocks in header: 36 seconds
Same exact content overall but change <script to <scriptx get build time to 1 second.

Here is one of the 2 script blocks I am referring to:

<script defer type="text/javascript" src="/assets/app.bundle.js"></script>

It doesnt matter if src is full url or relative. Doesn’t matter if src file exists or doesn’t exist.
If I remove those script blocks it runs in 1 second. If I rename the element from script to scriptx or anything not script, it runs in 1 second.

I am running with no plugins and just using “jekyll build”.

Is there something that is trying to process script blocks in markup??

2

is this in a markdown file? or in an include or layout? certainly sounds weird, I have similar things in my includes for the header and don’t have any issues.

3

This is in the default.html layout, used by all other layouts thus impacted every page. I am doing the following:

  1. Run app to query db and generate 60k+ pages into a collections folder.
  2. Run jekyll against 60k+ pages.

The test I used in this example limited the total pages in the collection to 100.

I am able to get around this by having the 2 script blocks in the header written out as <scriptx
After jeky is done, I am using a sed command to replace all <scriptx to <script. This is a script block that uses a src attribute, not embedded script.

This makes the 100 pages work in 1 second rather than 36 seconds. The only change is <script going to <scriptx.

That implies to me that there is some code in jekyll that is seeing the <script block and is doing something based on that.

With this fix the 60k+ pages take about 550 seconds to complete. Without that fix, I waited hours before I just cancelled the run.

4

huh.
Can you post the content of default.html? and maybe one of the collection items?

what version of jekyll?

that is also a way to profile the build - what happens if you do jekyll build --profile with the bad script block - it should show you info on times to build each thing.

when it runs slow have you checked the pages to make sure they actually render correctly? sounds like something is timing out, would seem like the pages would be incorrect?

What happens if you move the script block into an include, and then include that in the layout? that is the way I have it and I have not seen any issues.

5

also does it do the same thing with jekyll serve as it does with build?

6

Using jekyll 4.0.0. Moving script blocks into any include makes no difference.
Here is the default.html

    ---
    noticecta: gen-register
    ---
    <!DOCTYPE html>
    <html lang="en">

      <head>
        {% include head.html %}
        <link href="https://fonts.googleapis.com/css?family=Oswald&display=swap" rel="stylesheet">
        <link href="/assets/css/app.css" rel="stylesheet">
        <scriptx defer src="/assets/js/kusog.gallery-wvid.min.js"></script>
        <scriptx defer type="text/javascript" src="/assets/app.bundle.js"></script>
        </head>
      <body>

        <main>      
          <div style="position:absolute;top:0;left:0;right:0;background-color:rgba(0,0,0,.45);z-index: 10;">
            {% include navigation.html %}
            {% include login-form.html %}
          </div> 
          <div class="di-core">
            {{ content }}
          </div>
        </main>

        {% include footer.html %}
    </body>
    </html>

Here is one of the generated collection files:

    ---
    layout: product
    title: "Accel Gel: Raspberry Cream 24 Pack"
    ---
7

the collection is using layout: product - is that then using the default layout?

(I edited your post to wrap the code blocks in 3 backticks (`) to format the code properly - put 3 at the top and 3 at the bottom and the code will be formatted)

did you do the --profile on the build?

8

are you sure this isn’t a caching performance thing? the first time it takes 36 secs, the next time it takes 1 sec?

I don’t think this is it but thought I would check - so if you run build 3 times in a row (without the x) on the 100 pages without making any edits, what are the build times for each run? the first should be slow the next two should be much shorter.

9

This is the product.html template used which uses default layout.

---
layout: default
noticecta: gen-register
---
{% include jumbo-header.html %}
{{ content }}

I’ve spent hours testing this to come down to those script blocks causing the issue. Its very repeatable. I could make a screen cast when working with 100 items to show this. I have use profile option and it seems the timing for the liquid is not covering all the time taken by the build overall, not by a long shot.

10

any chance you can make a repo that you can share of 100 collections to test?

I played around with my 40 page site and it didn’t really matter whether I had script or scriptx. But it is a little too small to compare I think.

I’ll see if I can make one actually, shouldn’t be too hard.

11

I made a quick simple site and it didn’t make any difference at all - though maybe it is too simple and it just builds too fast?

I did:
jekyll new Blog --blank --to make simple blank site with no theme

then added a collection to the config:

collections:
  stuff:
    output: true

then created one html file in a folder called _stuff at the root, with:

---
layout: default
---

<p>Hi there</p>

then copied that file 10 times, then selected all 10 files and copy/pasted that 13 times so a total of 130 collection files.

I then added to the layout in the head:

<script defer type="text/javascript" src="/assets/app.bundle.js"></script>
  	<script defer type="text/javascript" src="/assets/app.bundle.js"></script>

when I run it it takes .5/sec the first time and .27 or so each additional time. adding an x to the script doesn’t change it at all really, it is varying by a couple tenths here and there but nothing close to what you are seeing, though again it is super simple so there is nothing to really copy I suppose.

12

I’ve setup a temporary repo for you to try. you can see it at https://github.com/kusog/jekyll-test. Note you should not try to use npm to build the scripts because they are already generated and I have not included the base scripts that the npm build needs. The npm build is separate from jekyll build. You should be able to just run jekyll build directly from the location once you pull the repo.

Here is the profile I see. I also setup a clean AWS linux ec2 instance and did this on that and saw the same behavior.

Here is the profile I get: With <script x:

+-----------------------------+-------+---------+-------+
| _layouts/default.html       |   106 | 360.34K | 0.082 |
| _includes/navigation.html   |   106 | 122.39K | 0.041 |
| _includes/head.html         |   106 |  61.36K | 0.025 |
| _layouts/product.html       |   100 |  50.72K | 0.015 |
| _includes/jumbo-header.html |   105 |  53.53K | 0.010 |
| _includes/footer.html       |   106 |  11.80K | 0.001 |
| index.html                  |     1 |   6.20K | 0.001 |
| _layouts/post.html          |     1 |   0.64K | 0.001 |
| _includes/login-form.html   |   106 |  38.92K | 0.001 |
| _layouts/page.html          |     3 |  10.22K | 0.000 |
| products.html               |     1 |   0.78K | 0.000 |
| _layouts/single-col.html    |     2 |   6.39K | 0.000 |
+-----------------------------+-------+---------+-------+
| TOTAL (for 12 files)        |   743 | 723.30K | 0.177 |
 
                    done in 0.739 seconds.

With <script:

| Filename                    | Count |   Bytes |  Time |
+-----------------------------+-------+---------+-------+
| _layouts/default.html       |   106 | 360.13K | 0.109 |
| _includes/navigation.html   |   106 | 122.39K | 0.057 |
| _includes/head.html         |   106 |  61.36K | 0.035 |
| _layouts/product.html       |   100 |  50.72K | 0.023 |
| _includes/jumbo-header.html |   105 |  53.53K | 0.015 |
| _includes/footer.html       |   106 |  11.80K | 0.002 |
| index.html                  |     1 |   6.20K | 0.001 |
| _includes/login-form.html   |   106 |  38.92K | 0.001 |
| _layouts/post.html          |     1 |   0.64K | 0.001 |
| _layouts/page.html          |     3 |  10.22K | 0.001 |
| products.html               |     1 |   0.78K | 0.000 |
| _layouts/single-col.html    |     2 |   6.39K | 0.000 |
+-----------------------------+-------+---------+-------+
| TOTAL (for 12 files)        |   743 | 723.09K | 0.245 |
 
                    done in 31.923 seconds.
13

your zip is 40k files due to the node modules folder, I took everything but that, deleted the gemfile and gemfile lock and then ran it and it seems fine - looks like it is more or less building everything, there are 140 files in the site folder, looks like all the product collection items are there:

PS E:\1-Repos\jekyll-test-master> jekyll b
Configuration file: E:/1-Repos/jekyll-test-master/_config.yml
            Source: E:/1-Repos/jekyll-test-master
       Destination: E:/1-Repos/jekyll-test-master/_site
 Incremental build: disabled. Enable with --incremental
      Generating...
                    done in 0.747 seconds.
 Auto-regeneration: disabled. Use --watch to enable.
PS E:\1-Repos\jekyll-test-master> jekyll b
Configuration file: E:/1-Repos/jekyll-test-master/_config.yml
            Source: E:/1-Repos/jekyll-test-master
       Destination: E:/1-Repos/jekyll-test-master/_site
 Incremental build: disabled. Enable with --incremental
      Generating...
                    done in 0.717 seconds.
 Auto-regeneration: disabled. Use --watch to enable.
PS E:\1-Repos\jekyll-test-master> jekyll b
Configuration file: E:/1-Repos/jekyll-test-master/_config.yml
            Source: E:/1-Repos/jekyll-test-master
       Destination: E:/1-Repos/jekyll-test-master/_site
 Incremental build: disabled. Enable with --incremental
      Generating...
                    done in 0.718 seconds.
 Auto-regeneration: disabled. Use --watch to enable.
PS E:\1-Repos\jekyll-test-master>

you do have various plugins in the gemfile - are you using them? my guess is one of them is causing an issue? seo maybe? not sure why I am picking on that one though - not sure any of them are 4.0 ready yet?

14

that was with this as the default layout:

---
noticecta: gen-register
---
<!DOCTYPE html>
<html lang="en">

  <head>
    {% include head.html %}
    <link href="https://fonts.googleapis.com/css?family=Oswald&display=swap" rel="stylesheet">
    <link href="/assets/css/app.css" rel="stylesheet">
    <script defer src="/assets/js/kusog.gallery-wvid.min.js"></script>
    <script defer type="text/javascript" src="/assets/app.bundle.js"></script>
    </head>
  <body>

    <main>      
      <div style="position:absolute;top:0;left:0;right:0;background-color:rgba(0,0,0,.45);z-index: 10;">
        {% include navigation.html %}
        {% include login-form.html %}
      </div> 
      <div class="di-core">
        {{ content }}
      </div>
    </main>

    {% include footer.html %}
</body>
</html>
15

I am not using any plugins. The config.yml shows that. The initial build should be 36 seconds.
Interesting that I see this same behavior on my ec2 linux - separate from my dev box.

16

you don’t have them in the config but they are in the gemfile - I don’t know how that works but I don’t think they should be there either.

1 Like
17

Man that was it! Removing the gemfile fixed that. Wow, I guess I can just dump the gemfile anyway.

18

cool - I don’t use either of the gem files, and don’t use bundler, I work solo and don’t use any plugins - makes it a lot simpler to me.

19

Thanks for that perspective. I just confirmed adding the plugins into the gemfile makes it slow and removing them makes it faster. Can keep the Gemfile, just cant keep the plugin stuff in there.

20

So having plugins defined in Gemfile can force the plugins even if they are not listed in the _config.yml?

I wonder why the Gemfile as still bringing those in even after I removed the plugins from the config.