Skip to content
This repository has been archived by the owner. It is now read-only.

Jekyll replacement #1

Closed
mmistakes opened this issue Oct 4, 2017 · 7 comments
Closed

Jekyll replacement #1

mmistakes opened this issue Oct 4, 2017 · 7 comments

Comments

@mmistakes
Copy link
Owner

@mmistakes mmistakes commented Oct 4, 2017

Testing what Gatsby has to offer and how it compares to Jekyll.

Build Speed

  • Building thousands of posts
  • Optimizing/resizing thousands of images

Markdown

How well does Kramdown written Markdown convert via remark?

Other

@BernCarney
Copy link

@BernCarney BernCarney commented Oct 22, 2017

Interested to see how you feel about Gatsby. Trying to decide between the two myself as I overhaul my site.

@mmistakes
Copy link
Owner Author

@mmistakes mmistakes commented Oct 22, 2017

I like Gatsby for a lot of things, but it's still early days for me to replace Jekyll with it (at least on my personal site). If you have a fairly simple site I think it's a no-brainer to use.

What I really like is how you can cleanup your Markdown files and remove a lot of custom tags and includes I'd typically use Jekyll filters for. I really like how Gatsby has transformers to take images written in standard Markdown (eg. ![my image](my-image.jpg) and can convert that into an <img> tag with all the responsive goodness of srcset... generating all of the appropriately sized images as well.

GraphQL is really great and that's another reason that's drawn me to Gatsby. I like the idea of being able to pull in all sorts of content from different sources and then query for what I need in the page generation process.

I don't really use React so that's not that big of a driver for me, but I do like the modern tooling behind Gatsby. Especially its focus on building performat pages... auto critical CSS, responsive images, etc.

What I don't like so much about Gatsby is the extra effort you have to put into doing some simple things Jekyll and other static-site generators take for granted. Gatsby is hands-off on a lot of things leaving it up to you on how you want to implement things. Which is nice, but also a pain if you have no clue how to write the necessary Javascript to do what you want.

For example, permalinks. I haven't really seen any Gatsby starters that handle them as well as Jekyll does. The examples I've seen are you either format your filenames in a certain way, or manually specify the path in front matter.

There's some other minor things missing with remark (its Markdown parser of choice). From what I've learned remark has a lot of plugins to do many of the things I'm used to Kramdown supported, but they're not available to Gatsby yet.

I'm definitely keeping an eye on Gatsby as things get more fleshed out.

@BernCarney
Copy link

@BernCarney BernCarney commented Oct 23, 2017

@mmistakes
Copy link
Owner Author

@mmistakes mmistakes commented Oct 23, 2017

Hugo is a solid choice and like Jekyll is fully featured and fleshed out.

I'm not as big of a fan of its templating language,but would be willing to look past that because it's extremely fast at building HTML files.

@mmistakes
Copy link
Owner Author

@mmistakes mmistakes commented Jul 11, 2018

Gatsby 2.0.0-beta.4

gatsby-test branch: gatsby-v2

  • 950 posts
  • paginated home index page
  • generated 13,758 images via gatsby-image

Built in ~14 minutes, which is great considering the Jekyll version of this builds in ~18 minutes and only generates 5,180 images.

Unfortunately trying to build paginated category and tag pages using front matter data in the 950 posts breaks the build with an out of memory error.

⠁ createPages
<--- Last few GCs --->

[14984:0000000000345910]   147690 ms: Mark-sweep 1680.8 (1788.3) -> 1680.8 (1742.8) MB, 715.8 / 0.2 ms  last resort GC in old space requested
[14984:0000000000345910]   148382 ms: Mark-sweep 1680.8 (1742.8) -> 1680.8 (1737.8) MB, 691.6 / 0.2 ms  last resort GC in old space requested


<--- JS stacktrace --->

==== JS stack trace =========================================

Security context: 000001B61C2A5879 <JSObject>
    2: push [E:\Users\Michael.Rose\Documents\Repositories\gatsby-test\node_modules\bluebird\js\release\queue.js:40] [bytecode=00000075F0AEA311 offset=156](this=0000008FAE1BADB9 <Queue map = 000000FC0E9C4939>,fn=000002215920BC71 <JSFunction Promise._settlePromiseCtx (sfi = 00000369CD4E4409)>,receiver=000000DD43F7F209 <Promise map = 0000015AB1EF8CE1>,arg=000000DD43F7F2F9 <Object map = 0000037272...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node_module_register
 2: v8::internal::FatalProcessOutOfMemory
 3: v8::internal::FatalProcessOutOfMemory
 4: v8::internal::Factory::NewUninitializedFixedArray
 5: v8::internal::WasmDebugInfo::SetupForTesting
 6: v8::internal::WasmDebugInfo::SetupForTesting
 7: v8::internal::WasmDebugInfo::SetupForTesting
 8: v8::internal::WasmDebugInfo::SetupForTesting
 9: v8::internal::SharedFunctionInfo::SetScript
10: v8::internal::JSReceiver::class_name
11: v8::internal::SourcePositionTableIterator::Advance
12: v8::internal::operator<<
13: v8::internal::operator<<
14: 000000D3A3E843C1
@mmistakes
Copy link
Owner Author

@mmistakes mmistakes commented Dec 5, 2018

Using the following build script helps with OOM issues:

{
  "scripts": {
    "build": "node --max_old_space_size=7168 node_modules/gatsby-cli build"
  }
}
  • ~1,000 posts
  • paginated tag and category archive pages
  • generated 24,660 images via gatsby-image

built in 3689.322 sec

@mmistakes
Copy link
Owner Author

@mmistakes mmistakes commented Jan 30, 2020

@mmistakes mmistakes closed this Jan 30, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants