Hi @13millonesdenaves,
Your REST API is taking a lot of time to respond. It responds this a lot of times…
⬢ httpstat https://13millonesdenaves.com/wp-json/wp/v2/comics_post/
> curl -w <output-format> -D <tempfile> -o <tempfile> -s -S https://13millonesdenaves.com/wp-json/wp/v2/comics_post/
curl error: curl: (7) Failed to connect to 13millonesdenaves.com port 443: Operation timed out
We recommend you to install something like WP REST Cache to improve this response time of your WP REST API
This slow response time can cause a server error if you do that request on the server side. With Frontity you could define a beforeSSR method to do some logic before the server responds with the initial HTML of your React app…
packages/twentytwenty-theme/src/index.js
...
const twentyTwentyTheme = {
name: "@frontity/twentytwenty-theme",
roots: { ... },
state: { ... },
actions: {
theme: {
...,
beforeSSR: async ({ actions }) => {
await actions.source.fetch(`/comics_post/`)
}
},
},
libraries: {...}
};
export default twentyTwentyTheme;
This will load your React App in the browser when this request is finished and attached to your frontity.state.source
If you are deploying your app to Vercel servers using now this code will provoke (in the case of a slow REST API like yours) the server to spend more than 10s to respond cause which makes Vercel servers to cut the connection and trigger this Task timed out error
[GET] /
16:05:02:15
2020-05-06T14:05:12.622Z 1baedd5a-d939-4e3c-988d-2bb830bcb083 Task timed out after 10.01 seconds
[GET] /
15:25:32:18
2020-05-06T13:25:42.684Z ea7700cc-ce15-4778-954e-9b5aaa348a85 Task timed out after 10.01 seconds
[GET] /
12:46:48:69
2020-05-06T10:46:58.792Z eb486a51-4555-47c5-a0da-117c124f6cbf Task timed out after 10.01 seconds
By moving that logic to the client, the request is done from the client side so no more timed out errors from the server
packages/twentytwenty-theme/src/components/sub-header-comics.js
import React, {useState, useEffect} from "react";
import { connect, styled } from "frontity";
import Link from "./link";
const ComicsSubHeader = ({ state, actions }) => {
const { comics_post } = state.source;
const { headerBg } = state.theme.colors;
useEffect(() => {
async function fetchData() {
await actions.source.fetch(`/comics_post/`)
}
fetchData();
})
const ComicsBar = ({comics}) => (<>
<TitleGroup>
<SiteTitle>
<StyledLink link="/comics_post">Comics:</StyledLink>
</SiteTitle>
</TitleGroup>
{
comics && Object.keys(comics)
.map(key => comics[key])
.map(({title, link}, index) => {
return (
<Link key={index} link={link}>{title.rendered}</Link>
)
})
}
</>)
return (
<PageHeader bg={headerBg} id="site-header">
<HeaderInner>
{ comics_post ? <ComicsBar comics={comics_post}/> : <p>Loading comics...</p>}
</HeaderInner>
</PageHeader>
);
};
export default connect(ComicsSubHeader);
...
Hope this helps
What are you building with Frontity? 
Here you have a demo → 
And the repo with the code → 
