NotionX / react-notion-x

Fast and accurate React renderer for Notion. TS batteries included. ⚡️
https://react-notion-x-demo.transitivebullsh.it
MIT License
4.8k stars 563 forks source link

Image access error associated with a NotionAPI and defaultMapImageUrl #355

Open shongs27 opened 2 years ago

shongs27 commented 2 years ago

Hello, I'm using the library you created. Thank you.

I'm having the same issue as #211

I'm looking at the code you wrote and I'm studying how various methods play a role.

I'm guessing that the issue I'm experiencing is related to a method called defaultMapImageUrl, and I found one while I was looking for a related code.

https://github.com/NotionX/react-notion-x/blob/bf81f2aa75c60b785e850b363901f47b9a2cd464/packages/react-notion-x/src/context.tsx#L13

The Function 'defaultMapImageUrl' was not found in the utils file

Is the problem I'm having coming from here?

As a junior, I would also like to ask you a question: How can I check the function that 'mapImageUrl' is doing? Because these methods are not written in official documents. it i Is the only way to check the code from scratch?

shongs27 commented 2 years ago

Another major factor for perf comes from images hosted by Notion. They're generally unoptimized, improperly sized, and not cacheable because Notion has to deal with fine-grained access control that users can change at any time. You can override the default mapImageUrl function on NotionRenderer to add caching via a CDN like Cloudflare Workers, which is what Notion X does for optimal page load speeds. - In Doc 'Performance'

I think the clue here is to cache the notion image

In this link, This Function is returning url with 'https://www.notion.so' and 'https://images.unsplash.com'. Does that mean add cache via CDN?