Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improving Largest Contentful Paint time? #673

Open
jparismorgan opened this issue Jul 14, 2024 · 2 comments
Open

Improving Largest Contentful Paint time? #673

jparismorgan opened this issue Jul 14, 2024 · 2 comments

Comments

@jparismorgan
Copy link

Hi there, I'm using this library for https://www.timecomplexity.ai, and it's working nicely, so thank you for that!

One issue I'm seeing though is that the Largest Contentful Paint time is quite high because of this library:

Screenshot 2024-07-14 at 3 22 05 PM

Curious if you have any suggestions on how to improve this? I'm using it in a next.js site hosted on Vercel like this:

import CodeMirror from '@uiw/react-codemirror'
import {go} from '@codemirror/legacy-modes/mode/go'
import {xcodeDarkInit} from '@uiw/codemirror-theme-xcode'

export default function Analysis() {
  return (
      <CodeMirror
            value={inputCode}
            placeholder={'Use AI to analyze your code\'s runtime complexity.\nWorks across languages and without requiring headers, imports, or a main statement - just the code itself.\nPlease note that results may be incorrect in subtle (or not so subtle) ways, so use at your own risk!'}
            autoFocus
            editable={!loading}
            minHeight="300px"
            extensions={[
              StreamLanguage.define(go),
              EditorView.lineWrapping
            ]}
            theme={xcodeDarkInit({
              settings: {
                fontFamily: inputCode.length === 0 ? 'var(--font-inter)' : ''
              }
            })}
            onChange={(value: any) => {
              if (value.length > MAX_CODE_LENGTH) {
                setErrorMessage(`Please enter code less than ${MAX_CODE_LENGTH} characters. You are currently at ${value.length} characters.`)
              } else if (typeof errorMessage !== 'string' || typeof errorMessage === 'string' && errorMessage.length !== 0) {
                setErrorMessage('')
              }
              setInputCode(value)
            }}
          />
    )
 }
@jaywcjlove
Copy link
Member

@jparismorgan I don't know what the issue is. How can it be reproduced?

@jparismorgan
Copy link
Author

@jaywcjlove you can generate a Lighthouse score on https://uiwjs.github.io/react-codemirror for example using Chrome Developer Tools. I checked and see Largest Contentful Paint 3.1s there:

Screenshot 2024-07-23 at 10 22 24 AM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants