Devlog (No. 30)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

Changes

• Update some parts of Daikon Debugger and removed some unnessary codes.
• Extended Debugger Width
• Desktop Runtime with unused RPC (will work on it)

Explanation Diagram

Drawn an Explanation Diagram on Figma that shows how Interface and Callbacks works, hope it’s good and does give some idea about @neneys/ui

Thanks for reading this minidevlog.!!
Love you all <3

Devlog (No. 29)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

About the Memory Leak Issue being Fixed

Many People in Review told me how did the Memory Leak get fixed and what was the cause of it?

Blog Link

May not open now, Since it hasn’t been built yet

Docs Changes

So, Here’s the docs with it being documented in the blog will be available once Github Actions Finishes

Updated Debugger

I’m working on a updated @neneys/ui Debugger to be more ease-to-use.

Will be finished in a less time, The Debugger will allow the ease of accessing and modifying an Widget Data for the Session and manipulate Shared Preferences.

Thanks for reading!!
Love you all >3 ❤️

Devlog (No.28)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

README.md

README.md has been improved alot with visual designs and details with Links and References Provided too and some Yashiro Nene based Images. Figma File is provided in link.

Docs Updates

The Home Page of Docs has been updated to look better and provide more information about NeneUI. The Docs Is now extended and now includes more information about implemented Widgets and Link to NeneUI Testing Kit

NeneUI Testing Kit

The NeneUI Testing Kit has been updated to show examples of @neneys/ui One being an AI Chat Application and other being an random Test with Pokedex, etc.

Nene Desktop Runtime

While Still Work in Progress, You can now follow the docs to Launch and test the Desktop Runtime. The Desktop Runtime is a standalone application that could embed @neneys/ui in it and Make Desktop Applications with just TypeScript.

A Stable Release

NeneUI will be released as a stable version 1.0.0 with Pub.dev and NPM Versions available soon as possible and will be kept updated

Thanks for your support till 1.0.0 Release!
I hope we meet soon!

Thanks <3333

Devlog (No.27)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

JavascriptEngine

JavaScriptEngine({…}) which could control Whether JS should be enabled or not and how much stackSize should be specified. xhr should be enabled or disabled

SEO Support for Flutter Web

With the Help of PHP to Render Text, Image and some minimal data. PHP can provide basic Page to Crawlers requesting the site. So that SEO could be utilised.

However, PHP Version Selection is limited to only allow the recently patched PHP versions for Security Reasons.

Github Actions

• Added Nene Desktop Runtime to be built in Github Actions

Bug FIxes

@neneys/ui had a Critical Memory and GPU Leak issue which kept the GPU usage at constant high even when not being used and being left Idle.

Docs Updates

JavaScript Execution and SEO Setup are now documented in the Docs and pub.dev and npmjs packages are now updated

NeneUI Testing Kit

NeneUI Testing Kit are now available on Web https://kwe26.github.io/neneui/tester However It could only open HTTPS and Cors (*) Apps only and is kind of limited with some JS Execution Issues. The User Interface of Testing Kit is also quite updated.

Close to Release

NeneUI is now Close to being 1.0.0 Release finally! Within 1-2 devlogs i’ll be shipping soon.!!

Thanks for reading!
Love you <3!

Devlog (No.26)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

Web - Platform Support
Finally, @neneys/ui is now supported on Web (Flutter Web). The Inconsistencies are now managed making @neneys/ui work directly on Web Too.

*Limitations on Web *
Same as Flutter Web - It’s hard for crawlers to idenitfy content of web pages.

I’m trying to fix that issue by double-rendering. Mostly by Setting-up an PHP to Interept the UI into HTML for Crawlers Making SEO work good!

README.md Changes

• FAQ Added into README (Address the Linux Compile Issue in FAQ related to quickjs_engine)
• More Decorative Elements

Github Actions
Nene UI Testing Kit finally compiles on all 5 (Windows, Linux, Android, iOS, macOS) successfuly.

Linux, macOS - May require libmpv to be installed or available on system path

We seem to be very close to first v1 Release with maximum widgets and support.

Thanks for Reading!!
I love you all 3<.!!!

Devlog (No.25)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

New Widget

• Layouts
• Layout

Layouts and Layout

It helps you make an Layout on Screen as show in Screenshot. And It can be arranged via an Handle too, It supports unlimited Layout on Screen as much as space is there.

Removed

Removed Skeleton Widget from Docs as it was no-longer rendering properly

README.md

The README.md is now updated with some Images and Decorative Work for looking more nicer and attractive

New Action

New Action such as ACTION.SET_DISPLAY_INDEX and ACTION.CLOSE_OVERLAY

AlertDialog is now documented under FeedBack Section

Nene Desktop Runtime

Nene Desktop Runtime is half-done and still has some issues, will try to fix it and make it install and run Apps soon!

Thanks for reading!!
I love you all >3

Devlog (No.24)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

WebSocket Support

NeneUI now supports WebSocket Rendering and Execution

WebSocket({
     url: "ws://localhost:3500/ws/home",
})

What Can it Do?

• Show Widgets Over WebSockets
• Execute Actions

Use Cases?

• ChatBots
• Live News?
• Messaging?

New Action

• Action.SEND_SOCKET

Uses FormSubmitAction as Parameter with :socket: as the callbackPath

New Functions

• SendWidget(socket, Widget)
• SendAction(socket, DoAction)

Thanks for Reading!
Love you all readers >3!

Devlog (No.23)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

New Features

• Shared Preferences
• ReqType
• Action.SOFT_RELOAD

SharedPreferences

You can use SET_PREFS and REM_PREFS Action to Set or Remove and PREF_EXISTS with exists and not parameters for functions

• GetPrefs
  When ReqType.POST is present you could use GetPrefs to get the preference value in UI/Callback Route

• GetFile
  Returns File Uploaded’s Path as in uploads/file.extension only works in Callback as that’s the place where you could recieve file.

• Action.SOFT_RELOAD
  Reloads the Screen without Changing any State or Position of Page.

Other Changes :- Remove Old docs/ folder and SKILL.md for AI Agents to utilise NeneUI properly

Thanks for reading.
love you all 🥰🥰

Devlog (No.22)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

NeneWorld - An Sample App

NeneWorld is an Sample App for @neneys/ui Showcasing some Little Things of NeneUI.

*Who Made It? : * Claude! Yes SKILL.md is coming soon to everyone, where the AI can read SKILL.md and create an App using NeneUI Library.

Features? of this Sample App

• Demo of NeneBottomnav, NeneDisplay
• Images
• Buttons and Callback
• Pokedex

Dw, Only the Sample is AI-written, The Main Project @neneys/ui Library is still an human-made project. And i do not want AI to take over NeneUI and write it itself, that would ruin this Library

Why Skill.MD?

So, that Users Can make an App using NeneUI and also ask AI For Help where they feel stuck. Tho it consumes tokens alot, cus NeneUI is becoming an more larger library

Excuz me what is NeneUI?

As i told earlier, NeneUI allows you to write the entire App UI in TypeScript and Render it Server-Side and produce in front of User. AND NO NENEUI IS NOT A WEBVIEW. It translates TypeScript into NATIVE Flutter Widgets. So the Interface feels native and uses Less RAM in this RAM Crisis Economy.

Status?

NeneUI is still in early stages, as i consider it. It still lacks many things such as an shared_preferences Implementation, WebSockets and proper Secure JavaScript Execution System.

Conclusion

I love if i get even tiny support for NeneUI and the people reading this devlog, I love you all who support me ;)

Love you >3…
Thanks for reading…!!!!

Devlog (No.21)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

New Widget & Major Feature

Added NeneDisplay to Change the Area of the Screen with a custom route, Like we see on normal apps.

NeneDisplay

It follows the index of bottomNavbar (or prescribed Variable) and loads the corresponding Page on the Area specified. Only Scaffold Body as a whole is supported as of now.

NeneDisplay({
         urlMap: {
                 0: "/ui/route_a",
                 1: "/ui/route_b"
         }
})

It has urlMap and followIndex arguments only.

Quick Note: It does not create a complete new Nene IDDB, It exists on top of the existing one so the variables do not disappear that were assigned by previous page
.
Thanks for reading today!!
I hope your day goes well

Love you all >3

Devlog (No.20) - A tiny update

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

CUSTOM WIDGET YAY!!!!

NeneBottomNavbar

Bottom Navigation Bar for NeneUI Apps!
With Two Types for Now normal, float

About

NeneNavbottom and NeneNavItem are the new widgets added.

Any New Widget?

Yes, NeneSidebar as well and NeneDisplay for Route and SPA System

THANKS for Reading !!!
Love you all.

Devlog (No.19)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

New Changes

• Added a Mouse Hover Effect like in Inspect Element for Debug Bar

Docs Changes

• Added Docs about SingleChildScrollView
• Compare & Variables Documentation
• Breadcrumbs

Future Changes

• Custom Widgets
• Layout Widgets mostly
• Custom BottomNavBar

Possible WebUI for SEO Purposes I’ve planned with PHP, Next.js but i have to yet choose which one would be easier to implement and best SEO.

I’m having a slight fever, so i’m unable to update many things i’ve planned in my mind, i apologise for it.

Anyways

Thanks everyone,
Love you for the support ❤️

Devlog (No.18)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

New Feature & Changes

• Changed Overlay Circular Progress Indicator to LinearProgressIndicator near AppBar for Form Submit
• New Action RELOAD UI (Soft-reloads UI)
• DebugBar (A.k.a Orb) Stays always active

Docs Changes

• Add Layouts Docs (Column,Row)
• Avatar Widget Docs
• Button, ButtonGroup
• MainAxis, CrossAxis Documented

That’s it for today, Thanks for Reading!!

Devlog (No.17)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

Bug Fixes

• Fix where Height/Width of Image’s Default Value was always 0.

Docs Progress

• Added Content Documentation
• Added Feedback Widgets Docs such as Progress, CircularProgressIndicator, etc.

Experiment

Tried to Experiment with Rust Renderer, It did not work as i don’t know rust much properly

Desktop Apps - Planning Update

I’ve planned to make the Desktop Apps be static but built from TypeScript and Bundle Flutter + Bun Shipping Desktop Apps.

Stardance Example

In the Stardance Example, I’ve added Banner Images Support if available and Creation Date and Devlog Count. More to come on the way.

Thanks for reading everyone
Love you all >3…..

Devlog (No.16)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

Bug Fixes in NeneUI

• Fixed a Bug where Padding caused Null Error in Some Widgets
• Fixed Card not having color passed down to UI Renderer

Docs Updates

The Documentation of Actions and Forms is now Complete!! Next Up Feedback and more!

Example App (WIP)

The Example app is located in stardance_ui.ts <– It’s an utilisation of Stardance API to show something and render it in NeneUI! (It’s in very very early stage also it’s letting me discover more stability bugs along with it.)

Info on Plugins

• I’m planning to pause on Plugins development and not include the @neneys/payments plugin in Testing Kit for Now.

Desktop App (Electron-like Solution) - [Planned]

I’m planning to make an Electron-like Framework but instead of Chromium we’ll use NeneUI to render the Desktop App.

Thank you for reading!!
I love the readers ;)

Devlog (No.15)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

What’s New in Docs?

-> I’ve Separated Base Components and Form Components
-> TextField, ColorPicker, CheckBox Docs Added
-> Sample Callback has been added

What’s Next?

• Add Actions and DoAction Docs and Explaining Callbacks
• Navigation System

What did i discover?

Appearently if you do not have Scaffold in a new page, Flutter makes it completly black page. It seems like Scaffold is required to be defined from NeneUI Server-Side.

Plans in NeneUI

• Implement More Controlled JavaScript Environment and Allow Enabling and Disabling JavaScript.
• Restrictions and More Functions to Manipulate Widgets

One More thing

Apparently, The NPM Package and Flutter Package is recieving alot of Downloads in week, idk how, But I’m very happy and i really want to thank them.
.
Anyways
.
Thank you for reading my devlog.
Love you all!!!! 🥰🥰

Devlog (No.14)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

Docs, Finally!

Tho it’s not complete but foundation is now laid!
Using Docsaurus for the Docs

Changes in NeneUI?

• Upgrade Sample App Version
• Publish 0.0.6 to Dart for Combability

Docs is available at

https://kwe26.github.io/neneui/

NeneUI is becoming more and more productional!

New Features & Bug Fixes Coming on the WAY!!!

NOTE: Only a few components are documented as of now!

Thanks for Reading
Love you all 😘😘

Devlog (No.13)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

Bug Fixes And Improvements

• Fix Bug where FormSubmit would .pop the context out
• Upgrade flutter_js to flutter_quickjs
• Improve NeneUI Testing Kit for Android
• Setup Plugins Support

New Features

• @neneys/payments - Yes, You can Accept Payments from NeneUI now too!
• Docs - Working on a Documentation based on Docusaurus

What’s Next?

• Improving JS Execution and Making it More Secure
• Working on Form Submission to fix some issues
• An Proper Docs for every Humans!
• Making @neneys/payments on Flutter to use url_launcher or Native Plugins instead of rendering it in Web, would be better.
• More Plugins!!

Hey, i’ve been thinking would it be good idea, if we make it an Electron like Windows/Linux/macOS App Making too but instead of Chromium it’ll be flutter render??

Thanks,
kwee26

Love you all 🥰

Devlog (No.12)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

Bug Fixes & Improvements

• Larger Files Now Do not Freeze The Entire App
• It can now process Large Files (e.g. Ubuntu ISO)
• A Single Error in Widget (exclusion of RenderOverflows) now don’t block entire app, As seen in Screenshot (2) below
• Error Handling has been improved.

Re-Designed: NeneUI Testing Tool

• It has been Renamed into NeneUI Testing Kit
• It now has a Nice Looking UI with Nene in Right!
• Links to Project now included and Confirmation of Launch App and Plugins Selection

Anyways, That’s it for Today!
Thank you!
Love you all 🤞🥰

Devlog (No.11)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

New Widget (as a plugin): VideoFrame Widget, Currently this is an prototype and i don’t gurantee complete stableness in this VideoFrame.

Other Major Changes

• Migrated to Latest Flutter SDK
• Removed Material Mentions
• Upgraded shadcn_flutter

New Fatal Error When Starting up
I have re-designed the Fatal Error when NeneUI couldn’t be initialized for some reason, now you can Try Again or even copy the Stacktrace on why is it happening

What are the plans?

• Improve Stability & Performance
• Focus more on Documentation

Theese Suggestions were given by Anon in Review, and i think i should focus on them more.

And that’s it for now
Thank you, for reading
Love you all 😘😘

Devlog (No.10)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

Here are the changes that were made and are planned

• NeneUI Tester
• Pre-hosted NeneUI Examples
• @neneys/payments system
• Video, Audio Players
• Custom Widget
• SharedPreferences

Please suggest more changes that can be added to @neneys/ui

Love you all ❤️

Devlog (No.9)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

I hope this is the last Devlog, before shipping the first version

Here’s the List of Changes made

• Added an Sample Project
• Extended Docs and Readme.md
• Fixed Bugs in TS Library
• Themes Support!
• showDialog -> showOverlay
• Package Renamed to as @neneys/ui

I really love this project, i always hoped for an Remote Server Side Native UI Rendering, And here we are with first release!!!

I hope for your genuine support and love for this project!

Thanks,
I love everyone ❤️ !

Devlog (No.8)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

I’ve thought of more useful features and added them as well, and you will love it

Here are the list of the features i’ve added

• File Uploads!!
• Breadcrumbs
• PropsReplacement
• Improved Nene HTTP
• ColorPickers!
• Some Docs
• Image Memory

File uploads was the hardest part to do, it took a lot of time debugging and working around
then there was loading image from memory i had to figure out what to do, so i just made it to load the selected file from memory

Known Funny Issue: Please don’t try uploading a GB worth of file, it freezes up your system, i think i may try writing an exception that prevents 500MB+ file being uploaded otherwise it’s disaster

I’m planning to ship 1st release by next blog soon enough, working on it from now on so it would be easier for everyone to use it

Here’s the Screenshot

Devlog (No.7)

NeneUI is an Server Side User Interface Rendering Library allowing developers to design user interface purely server-side without worrying about updating the code everywhere

I’ve been thinking and working on new features which would make it possible for NeneUI to be used productionally by all the developers

New Features

• ForEach Widget Support to ForEach Terms

Column('#forEachTest', {
    mainAxisAlignment: MainAxis.start,
    crossAxisAlignment: CrossAxis.start,
    foreach: true,
    children: ForEach('#forEachW', {
        varToForEach: "testMap",
        namespaceVar: "testMap",
        child: Row('#roWCh', {
            children: [
                Text('#TextABC', {
                    text: Var({
                        template: "Hello, %1 (%2)",
                        variable: "for.title,for.gender"
                    })
                })
            ]
        })
    })
})

The Code ForEach will only work inside children:[] where multiple widgets can be rendered
Such as Row, Flex, Table

• Frame Widget

Frame('#frame', { framePath: "/ui/test" })

This Widget Functions just like IFrames in HTML to render something inside another page

• Table Widgets
  The Table Widgets Include Table, TableCell, TableFooter, TableRow, TableSize

• DatePicker Widget

DatePicker('#dtp', {
          mode: PromptMode.dialog,
          defaultDate: DateTime.now()
})

PromptMode and DateTime are now integrated within Core.ts

• JavaScript Code Execution!! YOU CAN NOW EXECUTE JAVASCRIPT CODE TOO!!

DoAction(Action.JAVASCRIPT, `console.log("Var: "+getVariable("#userName.controller")); action('${Action.SHOW_TOAST}', Date.now() + ' Hello World ' + getVariable("#userName.controller"));`)

Currently Using flutter_js which in turn uses QJS behind the scenes

Modifications

• Image now supports Variable URL Support as well
• showScaffold Flag has been added to Daikon Renderer for Frame

Planned Stuffs

• ListView and GridView Support in Future Updates
• Usable JS Features
• OTP Input and More Shadcn_flutter Widgets

Thanks for Reading!!!!

Devlog 7

.
Context: it is an Server-Side Rendering Library for Flutter Apps so the UI can be updated without even touching flutter’s code or re-compiling the app.
.
.
New Features

• Added NeneHTTP and NeneCallback for Callback (IPC-like)
• Add AlertDialog Support
• Add HoverCard Widget
• Improve Types of Widgets to Ensure Easy Integration
• Remove Unused Imports
• Half-Done ForEach Support, Quite Difficult but will try to implement it soon.
• FormSubmit Button Widget
• Added Widget Props Manipulation as well to Manipulate or Replace Widget at any place.
  .
  I’m working on more new features to integrate, hopefully they get integrated with ease.

Devlog 6

.
. Context: It is an Server Side Rendering Library for Flutter Apps so the UI can be updated without even touching flutter’s code and re-compiling the entire app.
.
New Features

• Introduced CheckBox and TextField widgets with state reading support
• Added Context Menu functionality for various widgets
• Added NavigationItem, NavigationGroup, and NavigationDivider components
• Implemented Compare() for conditional UI rendering
• Added Refresh Interface option in Daikon Debug
• Integrated Iconify API for dynamic icon resolution and rendering
  .
  .
  I Plan to add More Features sooner enough. Completing NeneUI.

Devlog #5

.
Project Context:
.
This is a Server Side Rendering Library for Flutter that allows you to update the User Interface of app without completely re-building the app granting control from server-side and natively render all widgets instead of WIdget.
.
.
In This Update I’ve added

• Image Widget Complete Support in Daikon Renderer along with SVG Support
• Daikon Debugger
• Variable Display and Setting
• ButtonGroup Widget too!

You can see the attached video!!.

Devlog #4

.
Context for thoose who don’t know: I’m making an Server Side Rendering Library, Where You can Update your App without updating the entire app everywhere. Write in JS, Works in FLutter
.
Updates: Add New Widgets such as Card, Image, Feedback Widget (CircularProgressIndicator, LinearProgressIndicator, Button), Add Actions for Simple Reactivity
.
It uses the ID_Database to Manage Visibility of Widgets (Demo Given), The Actions can also invoke Navigation Push and Push Replace. and Also Show TOAST!!
.
Hope to see more coming changes soon to make it productional use ;) 😋.

Thanks
Kiwi

Devlog #3.1
.
Context for thoose who don’t know: I’m making a library that can render user interface for flutter from JavaScript, You can also refer it as Server Side UI Rendering, Where you can update your flutter apps without Updating the entire app.
.
I’ve added Some More Widgets such as Card, Image, Expanded, Container support to Flutter Render too!
.
Some Feedback Widgets are also added such as CircularProgressIndicator and LinearProgressIndicator
.
I’m also planning on idDatabase Manipulation and doAction() to perform actions as well.
.
I’m planning on to adding more and also an Tiny JS Runtime as well for Reactivvity (i’ve planend it for now)
.
More things Coming ;) 🥰

Devlog #3
.
Context for thoose who don’t know: I’m making a library that can render user interface for flutter from JavaScript, You can also refer it as Server Side UI Rendering, Where you can update your flutter apps without Updating the entire app.
.
I’ve finally made it to parse and render the User Interface in Flutter, I’ts really minimal right now.
.
I’m focusing to add more Widgets and stuff and reactivity of widgets in the end.
.
There’s lot more things coming ;;33😉

I have partially done the flutter renderer, haven’t tested it yet. will continue working tomorrow.

Hi there,
I’m working on a Server Side UI Rendering Linking Flutter and JavaScript.
.
You will write the code in javascript and it will be converted into JSON, which the flutter will parse and render. it is much more effective than WebView Apps.
.
And Since it’s Native means Native Performance too.
.
Currently I’ve only added few widgets in TypeScript only.
.
Scaffold, Center, Container, EdgeInsets, Expanded, Padding, SizedBox, Column, Row, SingleChildScrollView, Flex, Text, TextStyle
.
And Some Enums as well.
.
I’ve not made Flutter Renderer Yet. The lib/* currently looks like.