WPF vs Sciter
September 14, 2015Sciter, Uncategorized
| WPF | Sciter | |
|---|---|---|
| Definition | Windows Presentation Foundation (or WPF) is a graphical subsystem for rendering user interfaces in Windows-based applications by Microsoft. | Is an embeddable graphical user interface engine (dynamic or static library) by Terra Informatica Software. |
| Released | 2007 as part of Windows Vista. | 2006 – h-smile core release date (HTMLayout, Sciter1, Sciter2 and Sciter3). |
| OSes | Microsoft Windows | Microsoft Windows, Mac OS X, Linux/GTK. |
| Technology | .NET Framework 3.0 and above. Only managed API. | Native code with native plain C API. |
| Distribution | WindowsBase.dll, PresentationCore.dll, PresentationFoundation.dll (without .NET core) ~ 5 Mb | Single sciter32/64.dll ~ 4 Mb |
| UI Architecture | XAML DOM tree | W3C compatible DOM tree. |
| Markup language | XAML | HTML5 and SVG. |
| Style language | XAML, no cascading | CSS – cascading style sheets. |
| Code behind UI | .NET languages | tiscript (JavaScript alike, built-in), C, C++, Delphi |
| Data Binding | XAML data binding: one-time/one-way and two way |
|
| Media services | vector and raster images, audio, video | vector (SVG) and raster images, video with audio. |
| Graphics | WPF rasterizer on top of DirectX. |
Platform graphics:
|
| Graphic primitives | 2D graphics along with brushes, pens, geometries, and transforms. |
|
| Templates | Look of an element can be defined directly, via its properties, or indirectly with a Template or Style. | Look of an element can be defined directly, via its style properties, or indirectly via style sheets. Structure of elements can be "templated" by Behavior classes (native or in script) and Aspect functions and applied to elements via CSS – properties: behavior, prototype and aspect. |
| Animations | low level animation via timers and higher level abstractions of animations via the Animation classes. | CSS transform property based animations, timeline (TweenLite alike) animation engine, low level animations via Element.animate(). |
| Printing | Supports paginated documents via DocumentViewer class. | <frame type="pager"> supports print preview and printing of paginated HTML documents. Supports CSS page-break-after/before/inside properties. |
| Accessibility | Microsoft UI Automation | Microsoft UI Automation on Windows. |
Comments (13)
WPF – availability of documentation, lots of examples, syntax highlighting and hints, easy to learn, XAML and C#.
Sciter – there is little documentation and examples, its own specific syntax, no highlighting and hints, you will have to master HTML (specific)/CSS (specific)/TIS or JS (specific) in addition to the language in which the library is used.
This is just my observation. The tool is excellent, it’s a pity that on web technologies that differ from the standard at the same time.
Sciter(JS) uses standard JS and standard DOM implementation(+/-).
So “availability of documentation, lots of examples, syntax highlighting and hints” are also there.
Documentation: Sciter documentation, MDN, etc.
Syntax highlighting: VS Code, Sublime Text are pretty good as editors.
Syntax highlighting does not work everywhere, after installing the Sciter extension for VS Code, css stopped auto-completing, as well as js (I hope the problem is only with me), such constructions as in the screenshot (https://ibb.co/16VyQSs ) haven’t seen on the web standart. Now I am faced with a choice, to learn layout and write local web applications (or using electron) and this skill will come in handy in the future, or to spend time on Sciter, but apart from the forum, I did not find detailed documentation, for example document.on (I searched here: https://github.com/c-smile/sciter-js-sdk/blob/main/docs/md/Document.md).
Sciter extension for VS Code is not needed.
JavaScript (Babel) syntax scheme should work just fine (if VSCode has it…).
Sublime
These are optional. Instead of this:
<div #caption />use
<div id="caption" />Instead of
document.on("event","selector", ...)you can use either jQuery or document.addEventListener()Document is Element in Sciter, so is element.on()
That’s clear, but what would you choose among other alternatives?
WPF is not multiplatform.
Flutter uses completely different paradigms language, layout, styling.
Sciter is close enough to mainstream front end development. Many JS libraries can be reused as they are.
I’ve been told that average front end developer can get into Sciter in 3 days.
Without extension https://ibb.co/hxz5gvh
Of course, I noticed later that the document was being expanded by an element, but first of all I paid attention to the list of methods and did not find ‘on’ there.
In any case, thank you for the tool, small size, fast work, but probably not for me.
“Sciter extension for VS Code is not needed.”
In this case, when using, for example, the symbol (*) in css or flow, the editor shows errors and auto-completion disappears.
What can I say? Bug in VSCode, as simple as that.
But in css there is no such value for margin, the error shows fairly.
Today there is no such value, tomorrow they may add it.
The bug in that VSCode extension is that they cannot handle unknown constructs properly.
CSS specification clearly defines what shall UA (the extension in this case) do in case of unrecognized constructs. The extension does not follow those rules.
In any case any syntax highlighting is an approximation. You MUST NOT rely on its correctness – usually such extensions use RegExp for parsing (not real parsers). Not each syntax can be parsed 100% reliably that way.
The problem is not only in css, the editor also does not know anything about the ‘on’ method of ‘document’, because it is difficult to write code without constantly searching for information on each command, and since I am not engaged in web development, it is doubly difficult for me.
DOM Element in Sciter has ~10 or so specific methods. Not very hard to familiarize yourself with them.
But in any case … what if you will define new method like:
document.$("#someid").someNewMethod = function() {...}No JS extension will help you with that. So auto-suggestions have quite limited value in WebFrontend.
Thank you, now I have definitely decided.