unisonweb / unison

A friendly programming language from the future
https://unison-lang.org
Other
5.79k stars 270 forks source link

Unison cloud crashes with a large HTML tree #4548

Closed johngallagher closed 4 months ago

johngallagher commented 10 months ago

What I expect

An Html view to not crash Unison Cloud.

What I get

This function:

https://share.unison-lang.org/@johngallagher/csa/code/main/latest/terms/New/Csa/app/home@439fkgehkgs

At 439fkgehkgs crashes Unison Cloud.

When I deploy to dev or to local the effect is the same.

The page doesn't respond.

Note there's no timeout - the page hangs until I redeploy with a much simpler page.

The fix

When I remove the two elements in the nav it starts working again:

New.Csa.app.home : html_2_0_0.Html
New.Csa.app.home =
  use Attribute alt href id
  use html_2_0_0 a div label li span text ul
  element
    "html"
    []
    [ element
        "head"
        []
        [ element "meta" [charset "UTF-8"] []
        , element
            "meta"
            [name "viewport", content "width=device-width, initial-scale=1.0"]
            []
        , element "script" [src "https://cdn.tailwindcss.com"] []
        , element
            "script"
            [ crossorigin "anonymous"
            , integrity
                "sha384-D1Kt99CQMDuVetoL1lrYwg5t+9QdHe7NLX/SoJYkXDFfX37iInKRy5xLSi8nO7UC"
            , src "https://unpkg.com/htmx.org@1.9.10"
            ]
            []
        ]
    , body
        []
        [ div
            []
            [ html_2_0_0.header
                [class "antialiased"]
                [ nav
                    [ class
                        "bg-white border-gray-200 px-4 lg:px-6 py-2.5 dark:bg-gray-800"
                    ]
                    [ div
                        [class "flex flex-wrap justify-between items-center"]
                        [ div
                            [class "flex justify-start items-center"]
                            [                            ]
                        , div
                            [class "flex items-center lg:order-2"]
                            [                            ]
                        ]
                    ]
                ]
            , html_2_0_0.section
                [class "bg-white dark:bg-gray-900"]
                [ div
                    [class "max-w-2xl px-4 py-8 mx-auto lg:py-16"]
                    [ html_2_0_0.h2
                        [ class
                            "mb-4 text-3xl font-bold text-gray-900 dark:text-white"
                        ]
                        [text "Create Your Pattern"]
                    , form
                        [action "#"]
                        [ div
                            [ class
                                "grid gap-4 mb-4 sm:grid-cols-2 sm:gap-6 sm:mb-5"
                            ]
                            [ div
                                [class "sm:col-span-2"]
                                [ label
                                    [ class
                                        "block mb-2 text-sm font-medium text-gray-900 dark:text-white"
                                    , for "name"
                                    ]
                                    [text "Text For Pattern"]
                                , textarea
                                    [ class
                                        "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
                                    , attribute "hx-get" "/api"
                                    , attribute "hx-swap" "outerHTML"
                                    , attribute "hx-target" "#preview"
                                    , attribute
                                        "hx-trigger"
                                        "input changed delay:100ms, load"
                                    , id "name"
                                    , name "name"
                                    , placeholder "Type text required"
                                    , attribute "required" ""
                                    , attribute "rows" "4"
                                    ]
                                    []
                                ]
                            ]
                        , div [class "", id "preview"] []
                        ]
                    ]
                ]
            ]
        ]
    ]

I've gone methodically though the HTML removing certain parts, but every time I narrow the scope and think I've identified the problematic element, the source shifts.

Looks like some kind of infinite recursion to me.. but that's a total guess.

pchiusano commented 10 months ago

More detail from Slack convo, but this seems unrelated to cloud, it's either something with the html library, or the runtime

https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1703981201212119

There's a real chance that my render function in the html library is very inefficient :grimacing:

Paul Chiusano (he/him)
  [1 day ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704062366726659?thread_ts=1703981201.212119&cid=CLUNF0J5S)
[@hojberg](https://unisonlanguage.slack.com/team/ULCUZG867)
 any chance it is doing some character at a time stuff, looping over boxed lists of characters?

Paul Chiusano (he/him)
  [1 day ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704062430826739?thread_ts=1703981201.212119&cid=CLUNF0J5S)
If you’re just doing that for escaping there’s probably a way to do it with patterns?

Paul Chiusano (he/him)
  [1 day ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704062485766229?thread_ts=1703981201.212119&cid=CLUNF0J5S)
[@John](https://unisonlanguage.slack.com/team/U02AQLX1M46)
 can you try just producing that html outside of a service or anything, like with a pure expression?

Simon Højberg (he/him)
  [1 day ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704062793773629?thread_ts=1703981201.212119&cid=CLUNF0J5S)
[@Paul Chiusano](https://unisonlanguage.slack.com/team/ULKFEUAFN)
 yep thats great intuition. Its indeed looping over char by char

Simon Højberg (he/him)
  [1 day ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704062799122729?thread_ts=1703981201.212119&cid=CLUNF0J5S)
[https://share.unison-lang.org/@hojberg/html/code/releases/2.0.0/latest/terms/@g3rtkf81f[…]aqe3e7e6vh9s6lkdhtvg05a4od7es99fe806ii8dt21dhprdtp75jseq10](https://share.unison-lang.org/@hojberg/html/code/releases/2.0.0/latest/terms/@g3rtkf81fc8b8lrsk1glofg7n9d8tbncocc6kabfovluvaqe3e7e6vh9s6lkdhtvg05a4od7es99fe806ii8dt21dhprdtp75jseq10)

Paul Chiusano (he/him)
  [1 day ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704062978694179?thread_ts=1703981201.212119&cid=CLUNF0J5S)
Yeah see if you can write it with a pattern, should be a lot quicker, basically you can capture many of all characters other than the escaped ones, then look at first character of remainder
:+1:
1

Paul Chiusano (he/him)
  [1 day ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704063016020589?thread_ts=1703981201.212119&cid=CLUNF0J5S)
Then repeat that

John Gallagher
  [1 day ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704123771524559?thread_ts=1703981201.212119&cid=CLUNF0J5S)
can you try just producing that html outside of a service or anything, like with a pure expression?
I'm not quite sure what you mean here 
[@Paul Chiusano](https://unisonlanguage.slack.com/team/ULKFEUAFN)
... can you give me more details? I thought it was a pure expression...

Cody Allen (he/him)
  [4 hours ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704200144581089?thread_ts=1703981201.212119&cid=CLUNF0J5S)
Yeah I can confirm that this watch expression hangs and gives my computer fan a workout:
> html_2_0_0.toText home
Taking a look at the toText implementation, certainly calling toCharList and escaping character-by-character isn't the most efficient implementation. But for this amount of HTML I would expect that to mean that it runs for maybe a second. It shouldn't hang for minutes (possibly forever?) like this.

Cody Allen (he/him)
  [4 hours ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704200183856209?thread_ts=1703981201.212119&cid=CLUNF0J5S)
Unless there is some infinite loop that I'm not seeing

Cody Allen (he/him)
  [4 hours ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704201535596699?thread_ts=1703981201.212119&cid=CLUNF0J5S)
It seems that the escaping is not really the issue. I replaced the escape function with identity and it still hangs.

Cody Allen (he/him)
  [4 hours ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704201570706379?thread_ts=1703981201.212119&cid=CLUNF0J5S)
Hmm though I suppose that could be the watch expression pretty-printer spending ages trying to figure out how to pretty-print a long string.

Cody Allen (he/him)
  [4 hours ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704201638851899?thread_ts=1703981201.212119&cid=CLUNF0J5S)
Nah actually it seems to be pretty fast at that

John Gallagher
  [3 hours ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704204024997349?thread_ts=1703981201.212119&cid=CLUNF0J5S)
Thanks for looking into this 
[@Cody Allen](https://unisonlanguage.slack.com/team/U012E5Y8RHP)
 - it's way beyond my competency levels right now to investigate. I'm struggling to just get my app working as I want!
Saved for later

Cody Allen (he/him)
  [3 hours ago](https://unisonlanguage.slack.com/archives/CLUNF0J5S/p1704204412127149?thread_ts=1703981201.212119&cid=CLUNF0J5S)
[@John](https://unisonlanguage.slack.com/team/U02AQLX1M46)
 thank you for reporting with an easy way to reproduce the issue! This looks like something that's not working well in Unison or the html library and not something that you should need to investigate further. I'll try to make sure that investigating and fixing this makes its way into the work queue.
hojberg commented 10 months ago

We updated the html library with some performance improvements. @johngallagher did that work for you?

johngallagher commented 10 months ago

Thanks for doing that @hojberg - I need to reintroduce that header to see if it's still an issue - been busy with other stuff but I'll do it in the next day or so.

Thanks for your patience and for being so responsive!

aryairani commented 6 months ago

Hi @johngallagher just wanted to check in on this!

johngallagher commented 6 months ago

Hi @johngallagher just wanted to check in on this!

Haven't had a chance to verify. Close this and I'll reopen if it's still an issue.