TypeScript XAML framework [closed] - javascript

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.

Related

Performance-wise: Is a WPF application better than an Electron one coded wisely? [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 5 years ago.
Improve this question
Recently, I have been reading about Electron and I got curious about its potential when compared to something already established in the market of building Windows 7 desktop applications (i.e., WPF).
So far, I noticed that those who lean towards Electron discuss the fact that it provides:
fast-development cycles: one familiar with HTML5, CSS3, JS, and some Node.js, is all set to jump right into building a desktop application.
cross-platform compatibility: being based on Chromium and Node.js, both cross-platform, the application can run anywhere where these two are supported.
beautiful and interactive GUI design: the combination of HTML5, CSS3 and JS has proven what is capable of achieving over the years.
straightforward and cost-effective web recycling: a web application can be relatively easy converted to a desktop application by the same developers who created it in the first place (i.e., saving costs).
When it comes to WPF, its supporters discuss the following favoring arguments:
access to native APIs: WPF fits well into the .NET framework giving the developer access to all native Windows functionality.
powerful XAML markup language: it is argued that the XAML allows efficient rendering of sophisticated UI elements, supports two-way data binding, and knowing it may be useful in other contexts (i.e., with appropriate adjustments, e.g., Android development).
high-performance and memory-efficiency: mainly due to the compiled nature of the language and, perhaps, other JIT idiosyncrasies.
If we take these arguments separately, we can agree that both technologies are respectable. However, when you ask developers for help choosing the right framework for your the project, things get a bit biased. I assume that the bias may be either because the questions are too unspecific, or because some are more familiar with one framework than the other and, thus, the comfort zone kicks in.
Hence, keeping in mind that both are just means to an end, and not life philosophies, when compared, it usually boils down to the following ideas. Please note that these are not my ideas, but what I collected from various discussion groups around the web.
DOM manipulation is an expensive operation, whereas XAML rendering is blazingly fast.
Electron gives you access to just a few native OS functionality through its APIs, whereas WPF gives you access to all since it lives on the .NET.
Electron is slower compared to WPF because JS is interpreted, whereas, say C#, is compiled.
WPF works well with the MVVM pattern, whereas something similar is harder to achieve in Electron.
Electron is fast to get started with, whereas WPF has a steep learning curve (but it looks more professional they say).
Electron is cross-platform, whereas WPF is tied to the .NET. Not sure whether the Xamarin/ .NET Core was taken into account.
Electron application size is large as it has to ship with Chromium and Node.js to accomplish its goals.
WPF is less actively improved compared to Electron (i.e., Electron is an open-source project).
Electron handles the application updates for you, whereas the same thing requires more work in WPF.
On one side, it seems that software engineers (i.e., especially those who work in the corporate world) tend to favor WPF. On the other side, web developers are excited about what Electron brings to the table. In my opinion, this is bias, and the fact that you work more with a technology than the other does not say anything about how suitable the technology is in itself.
Therefore, to avoid this bias and, perhaps, other nagging answers, I want to provide you with the following case study.
Let us say one is interested in building a Windows 7 desktop application with Electron. The goal of the application is to allow the users to configure and run an extremely computational-intensive statistical analysis on a large XLSX file (i.e., 1e5 rows). In short, the user fills in a form, a special syntax file is generated (i.e., json, xml, or txt), the application reads that file and performs the analysis with the parameters specified there. At the end, a pdf file with graphs and tables is provided to the user. Now, let us assume the following about this project:
the DOM is not directly manipulated. Rather, Vue.js or React are used because they implement a virtual DOM which is faster.
the application does not need access to all the native OS functionality. The application only requires to read/ write files to disk and, perhaps, send some notifications.
because JS is too slow to run the statistical analysis, a C++-based Node.js addon is written and called from JS. Behind the scenes, the C++ code constructs the objects and makes the computations. At the end, the resulting matrices and vectors are be exposed to the JS.
the developer cares to structure the application properly and separates the concerns as much as possible. To avoid unnecessary renderings, Vue.js or React components may be used.
the developer does not consider problematic the additional ~50MB in size added to the package by the Chromium and Node.js.
the application is hosted on a central repository and the updates are pushed to the end users.
Keeping these assumptions in mind, my questions to you are:
To what extent is a WPF application more efficient than an Electron application, given that the heavy computations are implemented in C++ or C# and packaged as a .dll? If it is, what causes these differences?
Is XAML more efficient for rendering interactive UI elements compared to Vue.js or React in combination with HTML5 and CSS3?
Disclaimer: I am bias towards Electron because I think it enables me to build the GUI faster than XAML. I may be wrong because I am not entirely familiar with what XAML has to offer.
Note: Please do not mark this question as inappropriate. It is specific enough and well documented, and it might help others facing the same decision.
Edit 1. Please provide arguments for downvoting/ flagging the question for closing. Perhaps, if you offer some constructive feedback the question can be improved.

Microsoft Fluent Design for Web (CSS framework) [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
As Microsoft recently released a design system called "Fluent Design", is it appropriate to apply it on web design?
Most of my searching has been for all Microsoft platforms, C# app, F# etc..
I have never seen anything regarding in web design.
April 2020 Update primary destination for Fluent Design is Microsoft's Fluent Design System website.
For official web frameworks go to github repos:
Fluent UI - A set of React components for building Microsoft web experiences. Good support and big following.
Office UI Fabric with only includes grid, typography, icons and utilities. No component and no dependency on React. Not very well maintained.
Some tutorials are available here.
Take a look at Microsoft Web Framework for details on the components, HTML structure and CSS that you would use to meet Microsoft's web design principles.
just copy-paste from the bottom of the MWF homepage.
This site is restricted to use by Microsoft employees and authorized vendors. No materials or code from this site may be used on non-Microsoft websites. By entering this site, you confirm that you are a Microsoft employee or an authorized vendor working on behalf of Microsoft. You further agree that the materials and code constitute Microsoft’s intellectual property, are limited for use on Microsoft-operated websites, and are subject to the applicable agreements governing your employment or vendor relationship with Microsoft.
You can use this library for Reveal Effect in Fluent Design System.
And you need to wait for the backdrop-filter CSS supported for background blur effect.
https://github.com/d2phap/fluent-reveal-effect
I'm just quoting Microsoft here.
It is perfectly relevant to the web design. Since these are just principles and not specific to any platform. So if you are a web developer and like the Microsoft way of thinking. it is perfectly fine to build a Web UI framework around these principles.
Please check out this video in which your question has been discussed in the Q&A session (22:00).
Check out the Fluent Kit framework.
It is a Fluent Design extension to the current Bootstrap version, using jQuery, so should be an easy starting point for anybody, really. Also, it is very well documented and the "work in progress", so you can expect further functionalities as the design itself develops.
Important update: Fluent Kit, as well as the whole Nespero project is closed.
Update: Fluent design now supports web, Android and IOS. https://www.microsoft.com/design/fluent/#/
Update: a high quality 3rd party react component framework called react-uwp can be found here
Update: new website is at https://fluentweb.com/
Update: link is now dead, and https://getmwf.com doesn't mention fluent design anymore.
Microsoft has a web framework for its own employees and vendors.
Looks like they are introducing fluent design components to this framework.
https://fluent.getmwf.com/

JavaScript framework for client [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
My team consists of more java guys and limited experience with JavaScript. I know this question have been asked several times, but just to get my facts right, I need to clarify few things as my experience in client side technologies are very limited. We've decided to build our solution using GWT instead of pure JavaScript framework (given there are more java experience).
These were the facts to back my decision.
100% written in java
Requires basic java skills (Java SE not Java EE)
OOPHM – Out of process hosted mode – Define your browser & version. Browser compatibility no longer our problem
Debugging – debug your GWT apps just like any other Java application, using your IDE's debugger
Optimized JavaScript - GWT writes faster and more compact JavaScript than you
But some of my application function needs to use external js libraries.
For e.g. Let's say I need make use of some specific js library to draw some stuffs on a particular page. (actually that js files written in dojos).
Can above requirement be accommodated with GWT?
Do you think the decision to go with GWT is wise or do have any other recommendation?
We've found sencha gxt has the best widget library around( I'm aware its commercial, at least i found all widgets what we need). Do you think it's a wise idea to use wrapper library over core GWT ?
Thanks in advance.
Can above requirement be accommodated with GWT?
Yes (see #Andrey Kapelchik's answer).
Do you think the decision to go with GWT is wise or do have any other recommendation?
Given your background and the points you mentioned, I think it is a very good decision. I have built apps with JavaScript, jQuery etc., but for anything that's larger than 1000 lines of code, I wouldn't want to build a JavaScript app "manually" again. The points that are decisive for me:
With GWT, I can re-use parts of the code both on the server and client side. For example, I can validate on the client side to give immediate feedback, then validate again on the server for security, using the same code.
I find my way much easier in large GWT projects. While it's certainly possible to arrange even large JavaScript code in a clear way, it always tends to get unwieldy.
I make intense use of IDE features all the time (refactoring, finding write access to fields, ...), and IDE support for JavaScript is too limited for me.
You will still need a tiny bit of JavaScript knowledge here and there. Your team definitely should learn CSS, and I'd recommend to learn it thoroughly - no matter which client side framework you choose.
We've found sencha gxt has the best widget library around( I'm aware its commercial, at least i found all widgets what we need). Do you think it's a wise idea to use wrapper library over core GWT ?
In a few projects I'm working on, we're using GXT, because that decision was made a few years ago. Here's my opinion: If you need to build something that looks very much like a desktop app, GXT may be perfect, otherwise I wouldn't recommend basing the app on GXT.
You get the best performance with pure GWT, and if you know CSS, it's much more flexible. GXT has some nice features, but working around its limitations, significant performance issues (and sometimes its bugs) can be quite time-consuming. If you really need a special GXT widget, you can still build a pure GWT app, and then add just that one GXT/SmartGWT widget.
I suppose GWT is perfect for the requirements and objectives of your described project. GWT has JavaScript Native Interface to use native JavaScript. JSNI allows integrating GWT with existing JavaScript or with a external JS library. It solves these issues by allowing you to integrate JavaScript directly into application's Java source code.
My team really struggled with this issue after many false starts we determined that JavaScript can not really be avoided and it is not as bad to master as I feared it would be. The time it would take to ramp up on GWT would be around the same as it would take to ramp up on client side JS MVC framework.
We did consider GWT but dropped it because it will be harder to maintain in the long run for the following reasons.
What if the developers of GWT loose interest in maintaining it, it takes a really sophisticated skill set to maintain something like GWT.
Widgets that we might want might be available for something other GWT and porting to GWT might be more work than we want to do.
Modern JavaScript MVC frameworks are getting really mature with a lot of really cool features that make it easy to develop complex one page apps.
Browser will get better, JS frameworks will get better, it will be easier to higher front end developers ... etc.
We also evaluated dojo and dumped it because we felt that customizing it was going to be too hard for our team. Here is what we ended up with.
Twitter Bootstarp for a CSS / widget framework
A bunch of different jquery plugins wrangled up form various places online
JQuery, Backbone, Handlebars for the client side MVC framework.
If i was starting the project again today, I would go with AngularJS from Google, it really is an amazing approach for building client side web apps. Especially because of the clever use of Dependency injection in JavaScript and the two way biding and a bunch of other stuff. I was at a Throne of JS conference and the google AngularJS guys were saying that they ported a 17,000 line GWT app to 2500 line angularJS app.

JavaScript template engines for mobile web applications [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 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

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