4 ms·

I really didn't find this algorithm to be as good as jQuery Masonry, posted on here a week or so ago: http://desandro.com/resources/jquery-masonry/ http://desa

I really didn't find this algorithm to be as good as jQuery Masonry, posted on here a week or so ago: http://desandro.com/resources/jquery-masonry/ http://desandro.com/resources/jquery-masonry/ Basically, jQuery Masonry does intelligent layout, but JLayout is just doing things which can be done with ordinary floats or even tables. It might seem archaic to use tables for layouts such as this but they work even if JavaScript is turned off. And clever use of floats and min-width and max-width can achieve the same effect as well. Why use JavaScript for something simple that can be done using CSS?

pak 16y ago
another significant drawback of JavaScript layout is that it creates very noticeable flash-of-unstyled-content, since the page isn't being laid out incrementally.
- NathanKP 16y ago
  That can actually be worked around easily enough by giving the content "display: none" CSS styling and then using the JavaScript code to display the content after it is laid out. However, if JavaScript is turned off the content will never show, so that is a problem.
  - themanr 16y ago
    > However, if JavaScript is turned off the content will never show, so that is a problem. You can work around this by using document.write to output the display: none styling.
    - NathanKP 16y ago
      Perfect! Why didn't I think of that before.
minalecs 16y ago
as a programmer.. I really suck at css and layout. Working on projects as a single programmer (startup type projects) I can't go out and hire a css guy and web design person. For me something like this is a no brainer, instead spending time trying to figure out why something is not positioned in one browser vs another.
n8agrin 16y ago
I don't think the point of this library is to provide a best fit layout as Masonry tries to. Instead this is a layout manager in which you could encode any number of layout algorithms including the Masonry algorithm. This layout manager design pattern, while likely always less efficient than native browser mechanisms, is something we'll probably see more of as the browser takes on a greater role as an application host. Without programmatic layout to complement or override the browser's native layout system we won't get the sorts of visual UI building systems and application layouts you're starting to see in frameworks like Cappuccino and Sproutcore.
- bramstein 16y ago
  You hit the nail on the head. The library is meant for applications that can not use CSS layout, because the algorithm they need is not possible in CSS, or because they are rendering to a context that does not have layout management such as Canvas or SVG. Think of projects like Mozilla Bespin (https://mozillalabs.com/bespin/ https://mozillalabs.com/bespin/) which uses Canvas for drawing its editor. Having standard layout algorithms available would be a great help there. I was quite hesitant about making the jQuery plugin public because I was fearing reactions such as this. It was meant as a demo, and a nice way to test the layout managers. For a long time I had a message on the jQuery plugin page stating something along the lines of "please, please, consider using CSS before you use this plugin." The nice thing about programming against a layout manager API is that you can easily write new algorithms while the (DOM) interface remains the same. It would be trivial to write a layout manager that does layout like Masonry. As another example, I'm currently working on a pack layout which can be used to pack small images into a larger one (e.g. CSS sprites,) and a layout manager that implements the CSS box layout module. I was also considering a text layout based on my TeX line breaking work (http://www.bramstein.com/projects/typeset/. http://www.bramstein.com/projects/typeset/.)

pak 16y ago

another significant drawback of JavaScript layout is that it creates very noticeable flash-of-unstyled-content, since the page isn't being laid out incrementally.

NathanKP 16y ago
That can actually be worked around easily enough by giving the content "display: none" CSS styling and then using the JavaScript code to display the content after it is laid out. However, if JavaScript is turned off the content will never show, so that is a problem.
- themanr 16y ago
  > However, if JavaScript is turned off the content will never show, so that is a problem. You can work around this by using document.write to output the display: none styling.
  - NathanKP 16y ago
    Perfect! Why didn't I think of that before.

minalecs 16y ago

as a programmer.. I really suck at css and layout. Working on projects as a single programmer (startup type projects) I can't go out and hire a css guy and web design person. For me something like this is a no brainer, instead spending time trying to figure out why something is not positioned in one browser vs another.

n8agrin 16y ago

I don't think the point of this library is to provide a best fit layout as Masonry tries to. Instead this is a layout manager in which you could encode any number of layout algorithms including the Masonry algorithm. This layout manager design pattern, while likely always less efficient than native browser mechanisms, is something we'll probably see more of as the browser takes on a greater role as an application host. Without programmatic layout to complement or override the browser's native layout system we won't get the sorts of visual UI building systems and application layouts you're starting to see in frameworks like Cappuccino and Sproutcore.

bramstein 16y ago
You hit the nail on the head. The library is meant for applications that can not use CSS layout, because the algorithm they need is not possible in CSS, or because they are rendering to a context that does not have layout management such as Canvas or SVG. Think of projects like Mozilla Bespin (https://mozillalabs.com/bespin/ https://mozillalabs.com/bespin/) which uses Canvas for drawing its editor. Having standard layout algorithms available would be a great help there. I was quite hesitant about making the jQuery plugin public because I was fearing reactions such as this. It was meant as a demo, and a nice way to test the layout managers. For a long time I had a message on the jQuery plugin page stating something along the lines of "please, please, consider using CSS before you use this plugin." The nice thing about programming against a layout manager API is that you can easily write new algorithms while the (DOM) interface remains the same. It would be trivial to write a layout manager that does layout like Masonry. As another example, I'm currently working on a pack layout which can be used to pack small images into a larger one (e.g. CSS sprites,) and a layout manager that implements the CSS box layout module. I was also considering a text layout based on my TeX line breaking work (http://www.bramstein.com/projects/typeset/. http://www.bramstein.com/projects/typeset/.)