I know this got removed but are there any plans to create a package with the old code?

Hi Bodil,

Thank you for your effort in putting together this library — I’ve been using it happily in a few projects.

I have come across an error in which rendering a large number of elements to the page will exceed Javascript’s maximum call stack size. The code in question relies on traverse_ to render several thousand rows of a table.

About The Error

The error in question:

Uncaught RangeError: Maximum call stack size exceeded
    at Monad.Applicative0 (bundle.js:24516)

...

// bundle.js 24516
var monadMarkupM = new Control_Monad.Monad(function () {
      return applicativeMarkupM;
  }, function () {
      return bindMarkupM;
  });

@justinwoo helped me realize that by default monadic code isn’t tail recursive; if I need it to be, I need to use a traversal that implements MonadRec from purescript-tailrec. If the monad implements MonadRec, I can use purescript-safely or write my own tail-recursive function and all is well.

However, MarkupM doesn’t have an instance of MonadRec. In a discussion with @natefaubion, he had suggested there may not be a possible instance of MonadRec for this monad.

Finally, I am relying on purescript-pux, which itself relies on Smolder for its HTML. At the moment, I am not aware of a way to use another HTML library with Pux.

Reproduction

I’ve created a GitHub repo that implements a simple demonstration of this, and which should be easily cloned / run if you’d like to take a look at the error and the code that causes it directly.

https://github.com/saylu/purescript-framework-benchmark

Next Steps

With all of this said, the main questions I am looking to answer are:

1. Is there a way to handle this case effectively in Smolder?
2. If not, is there a possible workaround so that it is possible to render a large number of items, even if it is slow?

Wishing you the best,
Thomas

Looking at bower.json, it looks like this is LGPL3. Is that right?

I'm using this for purescript-rest, and I'd like to reference the license properly.

#53
It can't even catch up a new purs version.

The fact that

render $ a ! href "some%20string" $ text "inner"

produces

<a href="some%2520string">Inner</a>

rather than

<a href="some%20string">Inner</a>

Seems a bit unexpected. I ran into an issue with using Pux, as the react renderer won't encodeURI href props, but attempting to render the same markup to a string caused this double encoding issue.

Is this expected behavior?

(Related: #31)

Some tags like main are missing
While it's trivial to define them with parent it would be nice to have all of them builtin.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element

Would you entertain a pull request which made Markup into a law-abiding monad? I would probably use the approach from the DSL chapter of the book.

I appreciate you might like to keep this approach for performance reasons, so I wanted to ask before starting to write code ...

<ul /> is invalid HTML 5 for example, but will be generated by H.ul $ mempty. For HTML which is generated programmatically, this can be an issue.

Maybe each element needs to track whether it can be self-closing or not?

With large inputs, fromStream in Text.Smolder.Renderer.String can exceed maximum call stack. In our project, we have experienced this with a textarea containing text with 11302 characters and 152 lines. To prevent this, tail recursion can be added to fromStream.

I define comment as follows, but this is obviously premature rendering and depends on text not escaping its string (which I think it should).

comment :: Markup -> Markup
comment m = text $ "<!--" <> render m <> "-->"

It would be nice to offer first-class commenting support out of the box.

Are there already some other maintainers of this package? Otherwise I could be one, just to release new versions of this package compatible with newer PureScript releases. e.g. #47

I'd expect text "<hello>" to appear in the rendered webpage as "<hello>", but it's not escaped so it's not rendered at all.

First of all, thank you for all your hard work! Without you, the purescript package library would be woefully tiny.

I have a question about the correct way to use purescript-smolder with the DOM renderer.

In the README for this repository, this example is provided for adding a click listener to a button:

doc = div ! className "not-a-form" $ do
  button #! on "click" (\event → log "boom!") $ text "boom"

When I check the type of this in the REPL, it resolves to:

forall t11 t12.                     
  MarkupM                           
    (t11                            
     -> Eff                         
          ( console :: CONSOLE      
          | t12                     
          )                         
          Unit                      
    )                               
    Unit

The type for render is render :: forall eff. Element -> Markup (E eff) -> Eff (dom :: DOM | eff) Unit, so when I go to render like this: render wrapper doc (where "wrapper" is an Element), I get this compiler error:

  Could not match type

    Function t1

  with type

    EventListener


while trying to match type t1
                           -> Eff
                                ( console :: CONSOLE
                                | t2
                                )
                                Unit
  with type EventListener
              ( dom :: DOM
              | t0
              )
while checking that expression doc
  has type MarkupM
             (EventListener
                ( dom :: DOM
                | t0
                )
             )
             Unit
in value declaration renderControls

where t0 is an unknown type
      t2 is an unknown type
      t1 is an unknown type

And I'm positively stumped. I'm still pretty new to purescript so reading an error like this is very difficult for me. I'm sorry to submit an issue here since I'm probably doing something wrong, but I didn't know where else to get help.

Thanks!

I would be nice if smolder worked on the browser side.

PR #42 has changes that work with purescript v0.12.0

Necessary for, for example, rending SVG elements in the DOM: https://developer.mozilla.org/en-US/docs/Web/SVG/Namespaces_Crash_Course#Scripting_in_namespaced_XML

related: bodil/purescript-smolder-dom#2

It would be useful for smolder to use the virtual dom package purescript-virtual-dom in purescript-contrib instead of rolling its own bindings. This would, for instance, standardized the VTree type across the libraries, and possibly other functionality.

See comment from @garyb here regarding smolder and virtual-dom.

I have this:

indexDoc = html ! lang "en" $ do
  head $ do
    meta ! charset "utf-8"
    meta ! httpEquiv "X-UA-Compatible" ! content "IE=edge,chrome=1"
    script ! src "/js/game.js" ! defer ""
    style $ text "a bunch of css here"
  body $ do
    div $ do
      canvas ! id "foreground"
      canvas ! id "background"

But it fails with "Cannot unify Text.Smolder.Markup.MarkupM with Prim.Function (Text.Smolder.Markup.MarkupM Prelude.Unit)." on the line style $ text "a bunch of css here" at column 5. Do you know how to fix this?

I have a raw html string coming from an external source, which I would like to insert into a Smolder Markup template. If I use the text function, the html gets escaped. I need to insert it as a raw string without escaping. Is this possible and how?

Now that MarkupM is a free monad, we can support things like

view = do
  top <- freshName
  a ! name top $ mempty
  ...
  a ! anchor top $ text "Back to top"

  where
  anchor name = href $ "#" <> runName name

Would you take a PR to change the MarkupM monad to use purescript-free?

I would also like to be able to use purescript-inject to make the various HTML element smart constructors work with different free monads, so that we can extend the DSL in libraries.

I appreciate if that's not the goal of the library though, so I wanted to ask before starting to work on anything.

If I add script ! type "application/sjon" $ text "" this is rendered (to string) as
<script type="application&#x2F;json></script>. It seems that all attributes are escaped href to which makes it useless.

The type of String could be substituted wtih Either String String with Left being unsafe (not escaped) and Right safe string (escaped when processes).

Hello, i want to use data attributes with Smolder, which means attributes that are not provided by the library, by definition. Could you point me to some resources about how to do that? Thanks in advance

Would it be ideologically right to have a HTML5.SVG module to emit svg tags?

I notice that the string renderer encodes markup into a very compact string. Would you have any interest in an encoder that does your typical pretty printing: probably accepting a set of options for indentation? I'm happy to do the work on this.