Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
NextJS optimisation gist
const ServiceBadge = dynamic(() => import(../Molecules/ServiceBadge’))
const ServiceHeader = ({service, title}: Props) => {
const router = useRouter()
const isMobile = useBreakpointValue([true, null, false], ‘base’)
return (
<HStack>
<BackButton onClick={() => router.replace(ROUTE_ROOT)} />
{isMobile && <ServiceBadge {…service} />}
<Heading>{title}</Heading>
</HStack>
)
}
const handleLogout = async () => {
await supabase.auth.signOut()
setUser(null)
const showToast = await import('../../utils/showToast').then(mod => mod.showToast)
showToast(keys.logout_success, 'success')
}
export const getStaticProps: GetStaticProps = async () => {
const examples = (await import(../api/model/examples’)).fetchModelExamples
const categories = (await import(../api/model/example-categories’)).fetchModelExampleCategories
const modelExamples = (await examples(FRENCH_MODEL.language)) ?? ‘’
const modelExampleCategories = (await categories()) ?? ‘’
return {
props: {
modelExamplesParam: JSON.stringify(modelExamples),
modelExampleCategoriesParam: JSON.stringify(modelExampleCategories),
revalidate: 900,
},
}
}
const withPlugins = require('next-compose-plugins')
const {withPlausibleProxy} = require('next-plausible')
const withBundleAnalyzer = require('@next/bundle-analyzer')
const nextTranslate = require('next-translate')
const plausiblePlugin = withPlausibleProxy
const bundleAnalyzer = withBundleAnalyzer({enabled: process.env.ANALYZE === 'true'})
const nextConfig = {
i18n: {
locales: ['en', 'fr', 'de'],
defaultLocale: 'en',
localeDetection: false,
},
reactStrictMode: true,
images: {
formats: ['image/avif', 'image/webp'],
domains: ['uploads-ssl.webflow.com', 'images.unsplash.com'],
},
}
module.exports = withPlugins([[plausiblePlugin, bundleAnalyzer], nextTranslate], nextConfig)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment