JavaScript template engines for mobile web applications [closed] - javascript

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 7 years ago.
Improve this question
I'm building an application using jQTouch. I'd like to take advantage of one of the JavaScript template engines to avoid manual generation of HTML using data returned from JSON services.
Which engines are known to provide good mobile compatibility, and coexist well with jQTouch (and jQuery Mobile)?

Compatibility is not a problem if your intention is to use the engine only in mobile browsers/wrappers (or modern desktop browsers). Moreover, the performance is essential for web-based mobile applications.
So you have a couple of options:
jQuery templates
Pros: more or less well documented, widely used.
Cons: it is no longer being maintained by jQuery team, ie forever beta.
Clousure templates:
Pros: rich construction blocks - ifs, foreach, etc. Can compile the same template for multiple targets (js, java ...)
Cons: you'll have to execute the compiler to compile the template even on development stage, that is, client side compilation is not available. For me, it's a pain. Although it's very powerful, seems like "a bazooka to kill a mosquito" if used only for web.
distal
Never used, but it seems more like a "dynamic UI engine" like knockout or angularjs than a template engine.
mustache (I pick this one).
It has a very simple (yet powerful) syntax - you can learn mustache in 15 minutes - and by not providing "complex blocks" it enforces you to create good models instead of fat and complex templates, with a bunch of ifs, whiles and foreachs.
There are engine versions for more than 10 languages, including javascript, .net, java, ruby...
Cons: The simplicity in a few cases becomes limiting
mustache + hogan
Hogan is a compiler for the Mustache templating language written by the guys from twitter.
It is really fast
It can compile templates at runtime or pre-compile for packaging tools.
AMD compliant (has a plugin for requirejs)
Is in active development
Cons: poorly documented.
mustache: http://mustache.github.com/mustache.5.html
hogan: https://github.com/twitter/hogan.js

I use Distal templates and it works on the iPhone.

I used jQuery templates for a large-scale jQuery Mobile single page app on ASP.NET MVC 3. Putting all the template files in a partial view worked quite well. Templates worked well on all browsers that jQuery Mobile supported including IE 6,7,8.
https://github.com/jquery/jquery-tmpl

How "big" is the application? If you are primarily after templates you should give Google Closure Templates a try -
http://code.google.com/closure/templates/
Some concepts -
http://code.google.com/closure/templates/docs/concepts.html

Related

Is Google starting to use Dart? Did they build a Closure (or GWT) to Dart compiler? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
We are trying to decide if to use Dart for building a web app. We are looking for a technology that will stay highly relevant roughly for the next 5 years.
Now that EcmaScript 6 specs are around the corner (should be out by the end of 2014) we can't make up our mind if Dart is really here to stay for the long run.
This is because as far as we know there is a missing piece to Google original plan for Dash (now Dart). As Google originally planned in its leaked memo:
What about the existing code bases for large Google Apps? Won’t they have to rebuild everything to take advantage of Dash? The Dash Cross Compiler should be capable of taking typed Closure code (with some restrictions) and converting to Dash. Although the migration process won’t be fully automatic, it should make moving over to a Dash codebase somewhat easier.
Therefore, this is the reason for this question.
Is there any effort to date from Google to build a Closure (or GWT) to Dart compiler or translator? In addition, do you know if Google started using it for any existing or new production web app?
In other words, our worry is that Dart will only be a language that is there to fill a transition period and to push Javascript to iterate a bit faster, but as soon as the major browsers will support ES6 (and ES6+) it will be abandoned.
We don't want to start any arguments on the pros and cons of Dart, we just need some factual info that could help us in this key decision.
Thanks
So far I have been mostly developing with GWT (scientific web-apps) but recently I also started to work with Dart.
Google is heavily invested in Dart (look at all the I/O talks) so I can't really imagine them dropping it. Also ES6 will solve some problems (modules, classes, etc) but it still is Javascript with all its problems and drawbacks.
While working with GWT there were two aspects, which make developing large scale web-apps actually feasible:
structured language (Java) & static types
compiler
1.) Java is a statically typed language and thus allows you to easily catch errors during development. Furthermore it is much easier to refactor your code when your IDE understands the structure of your code. The same advantages also apply to Dart.
2.) Both the GWT compiler as well as the Dart compiler are quite sophisticated They can do global optimizations (https://plus.google.com/111739836936169749229/posts/DSUgfWefyR3) and tree shaking (https://plus.google.com/110412141990454266397/posts/VK8URgZiLbS). If you develop web-apps with a 100.000 LOC, this is quite important and crucial.
Dart has one big advantage over GWT concerning the development story: Dartium has the DartVM baked in. This makes development and iterations as convenient as with Javascript
(GWT has SuperDevMode but that's not as fast).
You can checkout Java2Dart which could be used to transpile GWT code to Dart
I haven't heard of a Closure to Dart converter. I think this is obsolete because Dart can just make use of JavaScript by Dart-js-Interop. This helps to migrate existing apps to Dart by migrating the code part for part.
You can ask as many questions as you want, you won't get a guarantee that Dart will stay but I love to work with Dart and what I have heard many others do as well. I think this shows that Google created a great product. It will stay if enough developers jump on the bandwagon.

TypeScript XAML framework [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 9 years ago.
Improve this question
As a .NET/XAML developer I am wondering if anybody has started to write a framework which will replace Silverlight and Flex using technologies like TypeScript and XAML to produce HTML5, JavaScript and CSS cross platform desktop apps or RIA's.
If not, wouldn't it be great to have a framework which understands XAML (or just XML) to define the user interface and JavaScript or better TypeScript to code the view controller?
I know, Sencha has done a great job building a JavaScript framework called EXT JS to build rich internet- or desktop applications, but from a .NET developer perspective EXT JS sucks.
A .NET developer likes to design the UI's using tools like Blend or Visual Studio with the ability to hack code in XAML and not in JSON.
There is also a good approach called Zebra which renders completely inside an html-canvas, but it isn't XAML based and there is no ability to use themes at all.
Also jQuery UI and jQuery Mobile are great frameworks from an HTML developer perspective, but I am looking for a XAML based framework, because you have to code less in XAML than in HTML. There is also the ability to use Blend to design the UI.
I have asked myself this question months ago when Adobe gave away Flex and Microsoft didn't admit to extend Silverlight 5 and I answered it with:
Microsoft or Adobe should do this for us.
But today I think now it is up to us.
Depending on your feedback I would like to start such a framework as an open source project, but I hope that there is still one on the way^^
You don't really need XAML to write an HTML application as XAML is really just another kind of mark-up.
From your WPF/Silverlight experience, you will find that the following concepts were actually borrowed from HTML anyway:
XAML is mark-up for content, which is what HTML is
Resources are styles and behaviours, which is what CSS is
Some parts actually don't map directly, some of the triggers in your WPF program may be either CSS or JavaScript in a web application, for example. Also, in HTML attributes are used less than I have seen them used in WPF - normally all sizes and layouts are placed in CSS, not attributes in the mark-up.
You may not directly have a substitute for every available WPF control, but you will find that most things are possible.
Although there will be a learning curve involved in picking up HTML, CSS and JavaScript if you haven't used them extensively, they are useful tools in your tool-belt.
Correct me if I am wrong, but I believe you are looking for http://fayde.wsick.com. I am in the midst of rebuilding the framework in Typescript. Check out my blog at http://faydeproject.blogspot.com/.
there is also rAppid:Js http://www.rappidjs.com which is XAML based, but it's not made to work with Visual Studio or Expression blend.
A XAML framework for HTML/JS is a fantastic idea, XAML files could be converted in HTML5 or perhaps in JavaScript directly by having an InitializeComponents() method where all objects are instantiated (like in WinForms).
If you decide to start a such project, consider using a C# to JavaScript compiler like Saltarelle or Script#.
Search the Web for
"M&P H5J is Silverlight in HTML5"
it implements an XAML processor in TypeScript.

Choosing the right UI templating tool - dust.js? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I work on a large Java based web application, it has been built up over the past 5 or so years - the UI needs an overhaul / to be largely re-written. We are investigating the available UI tools/libraries/frameworks to use and have come across dust.js as an option for templating.
The questions:
I'm interested in hearing what users of dust.js think of it:
Has it been successful?
Is it easy to use?
Is it sufficiently documented?
Is community support good? (only 6 questions on ST tagged 'dust.js'!)
What are the pros and cons when compared to other templating tools such as Underscore's templating, Google Closure Templates, Handlebars and Mustache.
Are there any problems using it with an MV* structure framework, e.g Backbone.js (online book)?
Some background:
Why are we interested in dust.js: The following LinkedIn blog posts first drew our attention to it:
Leaving JSPs in the dust: moving LinkedIn to dust.js client-side templates
The client-side templating throwdown: mustache, handlebars, dust.js, and more
The second of the two posts very nicely answers question 5, but asides from LinkedIn, very few results from Google detail the templating system or imply that it is a popular choice. In addition, the post mentions that they have extended the functionality and hope to one day contribute to the original project. I'm concerned that until they do that, we may also need to extend functionality.
Having said this, LinkedIn's original requirements for a templating system are very close to ours (see below) and they have clearly done some very thorough investigations before choosing.
Our requirements:
DRY: We ideally want to use the templating system on the server (Java based) and client-side, or just client-side if we opt for LinkedIn's complete approach; Instead of using a JSP, GSP, or ERB to assemble a page server side and send back HTML, we have the server send back just the dynamic data as JSON and have the page assembled in the browser using a static client-side template served from a CDN"
Fully internationalised
Good community support
Sufficiency easy to use / pick up
Works happily with jQuery and Backbone.js
Well documented
Dust.js is a good option. It is better than some of the other templating frameworks because it does not constrain that the data should be in a file, or in a string, etc.
Also it is being actively maintained https://github.com/linkedin/dustjs.
Has it been successful?
Yes, I know at least LinkedIn is using it and also contributing improvements/patches, etc.
Is it easy to use?
I have tried using it and it is as easy as Mustache or Handlebars.js.
Is it sufficiently documented?
Yes http://akdubya.github.com/dustjs.
Is community support good? (only 6 questions on ST tagged 'dust.js'!)
If you are comparing Mustache or Handlebars.js, dust.js does not have as many users, but I believe if you have an issue and post it on the LinkedIn repo they would definitely respond. I will too since I'm watching it :-)
What are the pros and cons when compared to other templating tools such as Underscore's templating, Google Closure Templates, Handlebars and Mustache.
As for pros, you can check when you should consider using dust.js here https://github.com/linkedin/dustjs#readme.
As for cons, there aren't enough users for dust.js compared to popular ones like Mustache or Handlebars.js. That said, the other libraries like Google Closure suffer the same problem.
But like I mentioned before, dust.js is designed very well compared to other frameworks IMHO.
Are there any problems using it with an MV* structure framework, e.g Backbone.js (online book)?
I have not used it with other MVC frameworks, but I don't think it should be a problem at all.
Hope that helps.
I'm doing a freelance project now for quite a big and established niche IT company and they've chosen dust.js for their HTML5 mobile app framework. And yes, LinkedIn is a big and successful company.
Sort of. Nothing really difficult but I needed to get accustomed to it. I worked with Freemarker on Java - Freemarker seemed quite a bit easier to use because of a lot of built-in power features. However, many may find dust.js nice - it has its clear logic, very lightweight syntax - there are things in dust.js to really like for many.
Freemarker for Java was documented much better. dust.js's GitHub page is very OK for starters but, for example, I couldn't find the description of all the dust.js filters there and needed to search on Google for it - however, that search easily provided me with the info I needed.
Didn't see much community support but the library is really lightweight and clear - a couple of Google searches was all I needed to gather all the necessary info.
Didn't use other JS templating tools.
The company I mentioned in the answer to the 1st question has built a lightweight HTML5 framework using dust.js together with both jQuery and Backbone.js. I'm doing the project for them using that framework and tapping to both jQuery and Backbone.js functionality all the time - nothing to complain about. dust.js is a little bit like Backbone.js - lightweight and not imposing much restrictions on your coding style or other libraries you use. Using it you will see that there is some preferrable form of JS objects you use to feed it with the data but it's easy to get accustomed to (I mean if you need lists of something in your views it's better to feed dust.js with lists and not JS object hashes which at the same time are natural at describing separate entities).
One thing about performance - you can develop your app with "full" version and then compile your templates for production (using for example node.js + dust.js npm module - grunt can be useful here) to be used with "core" version. In this case you could get quite a boost in real-world performance - putting all the templates together and minifying them will free the client browser from fetching the templates from server every time it needs them. "Full" and "core" are not about commercial/free - the core version just doesn't have the template compiler and is to be used with pre-compiled templates.

Freeware Ui designer for alternatives-to-extjs frameworks [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 8 years ago.
Improve this question
I have read this two posts:
What are alternatives to ExtJS?
free and open source alternative to extjs
Is there any freeware Ui designer for any of there frameworks?
I want to build a web file-browser
In general, you might check out this post:
HTML/JavaScript UI widgets GUI builder
Consider while looking at different tools that some might require special server back-ends. qooxdoo as a toolkit is all client-side.
The rest of this post concerns only qooxdoo and I don't think there are any mature ones available for qooxdoo right now. At least, there are none that are on par with the likes of the experience of developing in Visual Studio and with WinForms (as simply a comparison.) There are some early immature tool attempts at doing similar things, but they still will require a good understanding of qooxdoo and form placement. This is not a complete list:
qooxit: This is a project by Derrell Lipman who is very active as part of the qooxdoo development, but I'm not sure what has become of the future of this project. http://qooxdoo-contrib.svn.sourceforge.net/viewvc/qooxdoo-contrib/trunk/qooxdoo-contrib/qooxit/
jsqt: Uses Qt's .ui files and translates them. I have not used this and my guess is it has many limitations. http://qooxdoo.org/contrib/project#jsqt
Qooxdoo.Net: Uses Visual Studio to design the UI, but the project looks dead. http://sourceforge.net/projects/qooxdoonet/
I think there were also some attempts to put a WYSIWYG designer in front of the XML to qooxdoo tool called QxTransformer, http://qxtransformer.org/ but I may be confusing my projects.
Note that the qooxdoo license is dual licensed to LGPL/EPL. If you are working in a commercial environment some corporations are skittish of anything that isn't MIT or BSD licensed. I mention this in regard to your reference to the "free and open source" alternatives. While I firmly believe the intention of the application of LGPL/EPL is to allow us developers to do whatever we want with our creation as long as we contribute back to any enhancements to the qooxdoo libraries, corporate lawyers are afraid of nothing specific in writing. If you are doing this for commercial organization do your homework first. I had wanted to use qooxdoo for a project, but was prevented because of the license and my companies leaning toward MIT/BSD only open source licenses.
As a library goes, I think qooxdoo is the most feature complete and best structured. It is well documented though it does come with a learning curve. However, examples abound and the forum is very responsive. If there is any criticism about qooxdoo it might be that it is a heavier weight (size) library so that the final compiled javascript is often large (500-700k). For complex applications it can be a bit too intensive for smart phones and first generation iPads. However, nowadays this becomes less and less an issue and the mobile side of qooxdoo is evolving rapidly to provide a lighter weight solution. Basically, it keeps getting better and better.
Finally, here is a link to a discussion amongst qooxdoo developers about creating an IDE.
http://qooxdoo.678.n2.nabble.com/qooxdoo-quot-IDE-quot-Request-for-Comments-td3782909.html
From experience I think manual (text editing) form design is tedious and error prone and a tool to make it easier would be a godsend. qooxdoo's structure and "extends" capability would make it a prime candidate for a IDE implementation like Visual Studio uses with WinForms and .NET.
Before switching to Ext, we used the Yahoo libraries. We were using the old version YUI2, but version 3 is apparently also very good. It has many similar components such as grids (datatables) , menus, calendar widgets, etc.
http://developer.yahoo.com/yui/2/
http://developer.yahoo.com/yui/
Sencha Architect is a very nice product.
The DHTMLX library comes with a free online UI designer tool.
The library itself is dual licensed: GPL and commercial. The commercial license includes the desktop version of the UI designer.
There is also file explorer demo built with the dhtmlx components.
(Disclaimer: I work for DHTMLX).

JavaScript editor within Eclipse [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 4 years ago.
Improve this question
I'm looking for the best JavaScript editor available as an Eclipse plugin. I've been using Spket which is good. But, is there more better one?
Eclipse HTML Editor Plugin
I too have struggled with this totally obvious question. It seemed crazy that this wasn't an extremely easy-to-find feature with all the web development happening in Eclipse these days.
I was very turned off by Aptana because of how bloated it is, and the fact that it starts up a local web server (by default on port 8000) everytime you start Eclipse and you can't disable this functionality. Adobe's port of JSEclipse is now a 400Mb plugin, which is equally insane.
However, I just found a super-lightweight JavaScript editor called Eclipse HTML Editor Plugin, made by Amateras, which was exactly what I was looking for.
Disclaimer, I work at Aptana. I would point out there are some nice features for JS that you might not get so easily elsewhere. One is plugin-level integration of JS libraries that provide CodeAssist, samples, snippets and easy inclusion of the libraries files into your project; we provide the plugins for many of the more commonly used libraries, including YUI, jQuery, Prototype, dojo and EXT JS.
Second, we have a server-side JavaScript engine called Jaxer that not only lets you run any of your JS code on the server but adds file, database and networking functionality so that you don't have to use a scripting language but can write the entire app in JS.
Try the Vjet Javascript IDE from ebay (installation)
Ganymede's version of WTP includes a revamped Javascript editor that's worth a try. The key version numbers are Eclipse 3.4 and WTP 3.0. See http://live.eclipse.org/node/569
There once existed a plugin called JSEclipse that Adobe has subsequently sucked up and killed by making it available only by purchasing and installing FlexBuilder 3 (please someone prove me wrong). I found it to worked excellent but have since lost it since "upgrading" from Eclipse 3.4 to 3.4.1.
The feature I liked most was Content Outline.
In the Outline window of your Eclipse
Screen, JSEclipse lists all classes in
the currently opened file. It provides
an overview of the class hierarchy and
also method and property names. The
outline makes heavy use of the code
completion engine to find out more
about how the code is structured. By
clicking on the function entry in the
list the cursor will be taken to the
function declaration helping you
navigate faster in long files with
lots of class and method definitions
The new release of Eclipse (Helios) has an especific package for javascript web development. I haven't tried it yet, but it certainly worth a look.
Didn't use eclipse for a while, but there are ATF and Aptana.
Oracle Workshop for WebLogic (formally BEA Workshop) has excellent support for JavaScript and for visually editing HTMLs. It support many servers, not only WebLogic, including Tomcat, JBoss, Resin, Jetty, and WebSphere.
It recently became free, check out my post about it. Given that it was an expensive product not long ago, I guess it's worth checking out.

Categories

Resources