6 ms·

Show HN: Blabr – Scientific Computing for the Web

106 points by gballan 11y ago

ilovefood 11y ago
Best thing I saw this month on HackerNews
- mvclark 11y ago
  Thanks very much! Please let us know if you have any questions or feedback. We have several new blab examples to share, too. Martin and Gary - Blabr developers
capex 11y ago
Great work! what did you use to record the demos?
- mvclark 11y ago
  Developed a demo scripting tool ourselves. We plan to make it available for anyone to script their blab demos. Here's an example of a demo script: https://gist.github.com/mvclark/0a248098997a6f95635c https://gist.github.com/mvclark/0a248098997a6f95635c
sotojuan 11y ago
This is absolutely awesome.
- gballan 11y ago
  Thanks! Appreciate the support.
laurentoget 11y ago
This feels like it could be a candidate for replacing gnuplot + python except i am not sure how i would load a csv file into a blab
- mvclark 11y ago
  Blabr currently supports pasting a string of values (space-separated, or comma+space-separated) into a table column. (Conversely, if you copy a table column to the clipboard, its values are stored in the clipboard as a comma+space-separated string.) We plan to expand this functionality to support other import/export formats, including CSV and JSON. Meantime, you can use the numericjs library's parseCSV function. Here's a quick example: http://blabr.io/?9219b0773716623aef5e http://blabr.io/?9219b0773716623aef5e
  - laurentoget 11y ago
    Thanks.
forgotmypassw 11y ago
That demo was really nice to watch! One thing though, why does the "output" textarea show a list of values for kxx, (the y = kxx line early in) however when you make the table that dynamically computes values (editable cells table), you get a numeric result? Am I missing something here?
- mvclark 11y ago
  Thanks! By the way, if you click "Doc & Examples" (at bottom of blab), you'll see several of these dynamic demos under the "Demos" column. For the main demo on the home page, the editable table returns a vector x containing the values of the editable column. You could also have it return the computed values (kxx). Here's an example of how to do this: http://blabr.io/?70b9f256088478e4d861 http://blabr.io/?70b9f256088478e4d861 Edit the first column (x) and you see both x and y (x*x) displayed in the computation eval box. Down arrow in the last cell extends the table. Backspace in an empty cell removes the row. For more table examples, see links in http://blabr.io/?0a248098997a6f95635c http://blabr.io/?0a248098997a6f95635c.
roel_v 11y ago
(deleted 5 paragraph dismissive rant until I found out that this is part of a project for tools for STEM education, i.e. this is meant for educational samples only) I think it's rather important to look at it with that in mind.
- mvclark 11y ago
  Yes - STEM is a primary focus of Blabr. In fact, an initial application we had in mind was to convert interactive Excel spreadsheets from the Space Math @ NASA website (http://spacemath.gsfc.nasa.gov http://spacemath.gsfc.nasa.gov). We have several examples here: http://spacemath.github.io http://spacemath.github.io. These are all for educational purposes. The advantage for students is that they can view the modules directly in a browser (desktop, Chromebook, iPad, etc.), and interact with the modules immediately. No need to download spreadsheet documents that require compatible spreadsheet software. However, we also see Blabr as a candidate in other science/engineering areas. For example, these blabs are for phase locked loop design: * http://blabr.io/?01bec2bf0256d05f5b2d http://blabr.io/?01bec2bf0256d05f5b2d. * http://blabr.io/?0d6aa64641772d438350 http://blabr.io/?0d6aa64641772d438350 We think that these are viable alternatives to using Excel. They could serve as online, interactive data sheets for semiconductor company websites.
trengrj 11y ago
I've done similar work with R and Shiny which I think is great for communicating models but the R learning curve is sometimes a little steep. Blabr looks like it would be great in education, particularly if few galleries of common maths and science concepts were created.
- mvclark 11y ago
  We think so, too. Here's an example of a blab gallery based on modules from the popular Space Math @ NASA educational website: http://spacemath.github.io http://spacemath.github.io We would love to work with educators to create interactive blab galleries for math and science.
potomushto 11y ago
Is it possible to embed blab? Looks very clean and simple, would be nice to use it as a part of a blog post.
- mvclark 11y ago
  Currently, no. But this is our #1 priority. We're aiming for a simple embedding solution, e.g., 1) an html div with gist id attribute (plus loading a JavaScript file); and 2) a WordPress plugin. Stay tuned...
- mvclark 11y ago
  Here's a way to use an iframe to embed a blab in a web page: https://news.ycombinator.com/item?id=10529079 https://news.ycombinator.com/item?id=10529079 For WordPress, you could use an iframe plugin.
wb14123 11y ago
Does it support to import big datasets? If so, would the performance of browser hurts?
- gballan 11y ago
  Dev here. If the dataset takes a long time to download, then blabr isn't the right tool--its for smaller, conceptual, problems.
pan_w 11y ago
Nice website. Are you executing the code on the client or server? We are both instructors and have been working on a similar tool to help our students learn MATLAB, React, React Router, MongoDB, and Babel-ES6. It has worked really well for our students. Check it out: https://SaturnAPI.com https://SaturnAPI.com We'd love to collaborate or exchange ideas. If you are interested, feel free to email me at panthongw@gmail.com.
- gballan 11y ago
  Everything is executed on the client. Thanks for the invite! Will drop you a note soon.
  - pan_w 11y ago
    Cool, look forward to it
tigroferoce 11y ago
Great approach to a problem. I'd like to see more tools like this. Is it open source? Can I suggest you to support double screen so that the results is always visible?
yiyus 11y ago
As somebody who has to deal with spreadsheets every day and hates that workflow, I really appreciate the initiative. That said, I would like to see a more clear explanation of what is the use case. Scientific computing is a too general term. In other words, when should I consider blabr? How does it compare with a spreadsheet or a real programming language? Also important: when should I NOT use blabr?
- gballan 11y ago
  Thanks--we'll take that on-board.
- mvclark 11y ago
  Thanks for this great question. To answer it, a good place to start is with why we wanted to build Blabr. Some months ago, we were working with interactive spreadsheets from the Space Math @ NASA website: http://spacemath.gsfc.nasa.gov/ILabs.html http://spacemath.gsfc.nasa.gov/ILabs.html. These are all Excel spreadsheets, with interactive 'sliders' that let students experiment with a variety of mathematical models for planetary structure, heat flow and rotation among other modeled properties. The author of the spreadsheets (Dr Sten Odenwald, NASA) wanted to create online versions of these modules. He wanted a way for students to easily access and interact with the modules directly in a browser, on a range of devices used in today's classrooms (e.g., Chromebook, iPad). Using Google Docs (Sheets) was a possibility, but it didn't have support for the kind of sliders and plots that the modules required. But there was a more fundamental issue with spreadsheets: it's hard to understand the math. Mathematical formulas are cryptic because they (usually) use cell references, and are buried behind the results in cells. Consider, for example, the Excel file for the module "Basic Properties of Mars as a Planetary Body" (ILab11marsmodel.xlsx on the ILabs page above). It includes this formula for modeled center distance: =($J$5+$J$8*COS(6.242*(B8+16)/$J$11)) It isn't straightforward to understand the math behind that computation. And for the Space Math educational spreadsheets, math is a key part of the learning. Something like this would be clearer: m = r + a*cos(6.242*(t+16)/p) where r = slider "radius" a = slider "amplitude" p = slider "orbital-period" and t is a specified time vector (array). Note also that m is a vector dependent on the time vector t. In the Excel spreadsheet, this is accomplished by: 1. specifying t values (17 of them) in column B. 2. specifying the formula in a cell of another column. 3. copying the formula (16 times) in the new column. But how does the student know that the formula is the same for each row? That's very tedious to do by inspection. Typically, you look at the copied formulas and--based on a quick perusal of formulas and cell references--you assume that they are all the same formula. But this can be dangerous. We found that sometimes the formulas do differ as you move down a column. But what's worse, sometimes that's what the spreadsheet author intended, and other times it's a bug! For example, the spreadsheet author might have edited a formula and forgotten to copy it over all cells in a column. We felt that there's got to be a better way for these kinds of science/engineering/math spreadsheets. And that was the focus of the Blabr design. For the Mars spreadsheet, here's the blab equivalent we came up with: http://blabr.io/?3df6e2368e89a8c3f780 http://blabr.io/?3df6e2368e89a8c3f780. (More examples: http://spacemath.github.io http://spacemath.github.io) The math is much easier to follow than it is in the Excel spreadsheet. Moreover, a vector formula is specified in one place, rather than copied across a column of cells. In summary, we'd say that the following are reasonable criteria for using Blabr, rather than using a spreadsheet: 1. You want to create an online, interactive computational worksheet (web page) with sliders, tables, and plots. 2. A key focus of the worksheet is the math itself. You want the math to be easy to follow, and to edit. These are typical criteria for a range of scientific computing applications (especially for education and mathematical modeling), which is why we're focusing Blabr (for now) on the notion of "scientific computing for the web". Clearly there will be many use cases where a spreadsheet is more suitable than a blab. We'll give that part of the question more thought, and reply soon.
uberwise 11y ago
The name reminds me of "blah blah blah", i.e. no good.
IanCal 11y ago
Wonderful. I really like the idea of being able to deliver some interactive analysis, there's a huge amount of value I think in being able to let someone tinker a little bit with a threshold & explore things in a controlled way. Something I particularly like is that because it works in a browser I guess I could package it up as a single HTML file if I wanted and anyone could open it, or at least hosting becomes just "put the files somewhere" rather than running a server & backend code. I look forward to seeing how this progresses.
- mvclark 11y ago
  Thank you. Easily setting up "tunable" parameters (e.g., sliders) in a computation was a key requirement for Blabr. For example, it is very instructive/insightful to adjust the variable k in this compressive sensing blab to see the abrupt transition between sparsity and non-sparsity: http://blabr.io/?e8a066234715f21c21fd http://blabr.io/?e8a066234715f21c21fd Regarding packaging a blab: yes, it's very simple to share a blab on the web. After editing the blab, just click "Save" at the top right. This will save the blab to a Github Gist. You'll then get a link to the blab, like the one above (for the compressive sensing blab). Share the link with anyone. There are two ways to save a blab: 1. Anonymous Gist - easiest way, no need for GitHub account, but no revision control (new gist for each save). 2. Gist under your GitHub username - full revision control (gist revision each time you edit and save your blab); can make gist public or private.
mtw 11y ago
I love it! Have shared with friends Is it possible to work and then have others "fork" the results? Like jsfiddle
- gballan 11y ago
  Thanks! Please try the "Fork" link at the bottom of a blab. You can either save as a public gist or (with a token from GitHub) a private gist. We have some ideas about merging forks, but nothing concrete yet.
theuttick 11y ago
I recently went went public with something similar - www.cadwolf.com Mine is similar in that it does math in the browser. However, the goal of cadwolf is to do math and documentation on the browser and remove the need for the user to know a programming language. I really like what you guys did, but why would someone use blabr to run coffeescript instead of just running their own program? What is the use case outside of a learning tool? Also, I would love to know what you think of cadwolf.
h2033485 11y ago
Is it possible to alter the lines in the plot? For example `pyplot.fill_between` I'm thinking of ipython notebook viewer (now Jupyter[0])which has a cool xkcd[1] plot example. [0]:http://nbviewer.ipython.org/ http://nbviewer.ipython.org/ [1]: http://nbtest.herokuapp.com/url/jakevdp.github.com/downloads/notebooks/XKCD_plots.ipynb http://nbtest.herokuapp.com/url/jakevdp.github.com/downloads...
- gballan 11y ago
  Short answer: yes. Long answer: any javascript library (plotting or otherwise) can potentially be used within blabr by creating a "widget" [0]. (Although the API for creating your own widgets is under construction.) For example, [1] extends the built-in plot function (both based on flot [2]). We already use d3.js, so I am sure we could create a widget for xkcd plots based on [3] (say). [0] http://blabr.io/?ff66265ccd580d6a9b04 http://blabr.io/?ff66265ccd580d6a9b04 [1] http://blabr.io/?7b662930a33b1053072a http://blabr.io/?7b662930a33b1053072a [2] http://www.flotcharts.org/ http://www.flotcharts.org/ [3] http://dan.iel.fm/xkcd/ http://dan.iel.fm/xkcd/
backspaces 11y ago
Where is the repo? A project here in Santa Fe may be a useful addition and I'd like to get in touch with the authors.

106 points by gballan 11y ago

ilovefood 11y ago

Best thing I saw this month on HackerNews

mvclark 11y ago
Thanks very much! Please let us know if you have any questions or feedback. We have several new blab examples to share, too. Martin and Gary - Blabr developers

capex 11y ago

Great work! what did you use to record the demos?

mvclark 11y ago
Developed a demo scripting tool ourselves. We plan to make it available for anyone to script their blab demos. Here's an example of a demo script: https://gist.github.com/mvclark/0a248098997a6f95635c https://gist.github.com/mvclark/0a248098997a6f95635c

sotojuan 11y ago

This is absolutely awesome.

gballan 11y ago
Thanks! Appreciate the support.

laurentoget 11y ago

This feels like it could be a candidate for replacing gnuplot + python except i am not sure how i would load a csv file into a blab

mvclark 11y ago
Blabr currently supports pasting a string of values (space-separated, or comma+space-separated) into a table column. (Conversely, if you copy a table column to the clipboard, its values are stored in the clipboard as a comma+space-separated string.) We plan to expand this functionality to support other import/export formats, including CSV and JSON. Meantime, you can use the numericjs library's parseCSV function. Here's a quick example: http://blabr.io/?9219b0773716623aef5e http://blabr.io/?9219b0773716623aef5e
- laurentoget 11y ago
  Thanks.

forgotmypassw 11y ago

That demo was really nice to watch! One thing though, why does the "output" textarea show a list of values for kxx, (the y = kxx line early in) however when you make the table that dynamically computes values (editable cells table), you get a numeric result? Am I missing something here?

mvclark 11y ago
Thanks! By the way, if you click "Doc & Examples" (at bottom of blab), you'll see several of these dynamic demos under the "Demos" column. For the main demo on the home page, the editable table returns a vector x containing the values of the editable column. You could also have it return the computed values (kxx). Here's an example of how to do this: http://blabr.io/?70b9f256088478e4d861 http://blabr.io/?70b9f256088478e4d861 Edit the first column (x) and you see both x and y (x*x) displayed in the computation eval box. Down arrow in the last cell extends the table. Backspace in an empty cell removes the row. For more table examples, see links in http://blabr.io/?0a248098997a6f95635c http://blabr.io/?0a248098997a6f95635c.

roel_v 11y ago

(deleted 5 paragraph dismissive rant until I found out that this is part of a project for tools for STEM education, i.e. this is meant for educational samples only) I think it's rather important to look at it with that in mind.

mvclark 11y ago
Yes - STEM is a primary focus of Blabr. In fact, an initial application we had in mind was to convert interactive Excel spreadsheets from the Space Math @ NASA website (http://spacemath.gsfc.nasa.gov http://spacemath.gsfc.nasa.gov). We have several examples here: http://spacemath.github.io http://spacemath.github.io. These are all for educational purposes. The advantage for students is that they can view the modules directly in a browser (desktop, Chromebook, iPad, etc.), and interact with the modules immediately. No need to download spreadsheet documents that require compatible spreadsheet software. However, we also see Blabr as a candidate in other science/engineering areas. For example, these blabs are for phase locked loop design: * http://blabr.io/?01bec2bf0256d05f5b2d http://blabr.io/?01bec2bf0256d05f5b2d. * http://blabr.io/?0d6aa64641772d438350 http://blabr.io/?0d6aa64641772d438350 We think that these are viable alternatives to using Excel. They could serve as online, interactive data sheets for semiconductor company websites.

trengrj 11y ago

I've done similar work with R and Shiny which I think is great for communicating models but the R learning curve is sometimes a little steep. Blabr looks like it would be great in education, particularly if few galleries of common maths and science concepts were created.

mvclark 11y ago
We think so, too. Here's an example of a blab gallery based on modules from the popular Space Math @ NASA educational website: http://spacemath.github.io http://spacemath.github.io We would love to work with educators to create interactive blab galleries for math and science.

potomushto 11y ago

Is it possible to embed blab? Looks very clean and simple, would be nice to use it as a part of a blog post.

mvclark 11y ago
Currently, no. But this is our #1 priority. We're aiming for a simple embedding solution, e.g., 1) an html div with gist id attribute (plus loading a JavaScript file); and 2) a WordPress plugin. Stay tuned...
mvclark 11y ago
Here's a way to use an iframe to embed a blab in a web page: https://news.ycombinator.com/item?id=10529079 https://news.ycombinator.com/item?id=10529079 For WordPress, you could use an iframe plugin.

wb14123 11y ago

Does it support to import big datasets? If so, would the performance of browser hurts?

gballan 11y ago
Dev here. If the dataset takes a long time to download, then blabr isn't the right tool--its for smaller, conceptual, problems.

pan_w 11y ago

Nice website. Are you executing the code on the client or server? We are both instructors and have been working on a similar tool to help our students learn MATLAB, React, React Router, MongoDB, and Babel-ES6. It has worked really well for our students. Check it out: https://SaturnAPI.com https://SaturnAPI.com We'd love to collaborate or exchange ideas. If you are interested, feel free to email me at panthongw@gmail.com.

gballan 11y ago
Everything is executed on the client. Thanks for the invite! Will drop you a note soon.
- pan_w 11y ago
  Cool, look forward to it

tigroferoce 11y ago

Great approach to a problem. I'd like to see more tools like this. Is it open source? Can I suggest you to support double screen so that the results is always visible?

yiyus 11y ago

As somebody who has to deal with spreadsheets every day and hates that workflow, I really appreciate the initiative. That said, I would like to see a more clear explanation of what is the use case. Scientific computing is a too general term. In other words, when should I consider blabr? How does it compare with a spreadsheet or a real programming language? Also important: when should I NOT use blabr?

gballan 11y ago
Thanks--we'll take that on-board.
mvclark 11y ago
Thanks for this great question. To answer it, a good place to start is with why we wanted to build Blabr. Some months ago, we were working with interactive spreadsheets from the Space Math @ NASA website: http://spacemath.gsfc.nasa.gov/ILabs.html http://spacemath.gsfc.nasa.gov/ILabs.html. These are all Excel spreadsheets, with interactive 'sliders' that let students experiment with a variety of mathematical models for planetary structure, heat flow and rotation among other modeled properties. The author of the spreadsheets (Dr Sten Odenwald, NASA) wanted to create online versions of these modules. He wanted a way for students to easily access and interact with the modules directly in a browser, on a range of devices used in today's classrooms (e.g., Chromebook, iPad). Using Google Docs (Sheets) was a possibility, but it didn't have support for the kind of sliders and plots that the modules required. But there was a more fundamental issue with spreadsheets: it's hard to understand the math. Mathematical formulas are cryptic because they (usually) use cell references, and are buried behind the results in cells. Consider, for example, the Excel file for the module "Basic Properties of Mars as a Planetary Body" (ILab11marsmodel.xlsx on the ILabs page above). It includes this formula for modeled center distance: =($J$5+$J$8*COS(6.242*(B8+16)/$J$11)) It isn't straightforward to understand the math behind that computation. And for the Space Math educational spreadsheets, math is a key part of the learning. Something like this would be clearer: m = r + a*cos(6.242*(t+16)/p) where r = slider "radius" a = slider "amplitude" p = slider "orbital-period" and t is a specified time vector (array). Note also that m is a vector dependent on the time vector t. In the Excel spreadsheet, this is accomplished by: 1. specifying t values (17 of them) in column B. 2. specifying the formula in a cell of another column. 3. copying the formula (16 times) in the new column. But how does the student know that the formula is the same for each row? That's very tedious to do by inspection. Typically, you look at the copied formulas and--based on a quick perusal of formulas and cell references--you assume that they are all the same formula. But this can be dangerous. We found that sometimes the formulas do differ as you move down a column. But what's worse, sometimes that's what the spreadsheet author intended, and other times it's a bug! For example, the spreadsheet author might have edited a formula and forgotten to copy it over all cells in a column. We felt that there's got to be a better way for these kinds of science/engineering/math spreadsheets. And that was the focus of the Blabr design. For the Mars spreadsheet, here's the blab equivalent we came up with: http://blabr.io/?3df6e2368e89a8c3f780 http://blabr.io/?3df6e2368e89a8c3f780. (More examples: http://spacemath.github.io http://spacemath.github.io) The math is much easier to follow than it is in the Excel spreadsheet. Moreover, a vector formula is specified in one place, rather than copied across a column of cells. In summary, we'd say that the following are reasonable criteria for using Blabr, rather than using a spreadsheet: 1. You want to create an online, interactive computational worksheet (web page) with sliders, tables, and plots. 2. A key focus of the worksheet is the math itself. You want the math to be easy to follow, and to edit. These are typical criteria for a range of scientific computing applications (especially for education and mathematical modeling), which is why we're focusing Blabr (for now) on the notion of "scientific computing for the web". Clearly there will be many use cases where a spreadsheet is more suitable than a blab. We'll give that part of the question more thought, and reply soon.

uberwise 11y ago

The name reminds me of "blah blah blah", i.e. no good.

IanCal 11y ago

Wonderful. I really like the idea of being able to deliver some interactive analysis, there's a huge amount of value I think in being able to let someone tinker a little bit with a threshold & explore things in a controlled way. Something I particularly like is that because it works in a browser I guess I could package it up as a single HTML file if I wanted and anyone could open it, or at least hosting becomes just "put the files somewhere" rather than running a server & backend code. I look forward to seeing how this progresses.

mvclark 11y ago
Thank you. Easily setting up "tunable" parameters (e.g., sliders) in a computation was a key requirement for Blabr. For example, it is very instructive/insightful to adjust the variable k in this compressive sensing blab to see the abrupt transition between sparsity and non-sparsity: http://blabr.io/?e8a066234715f21c21fd http://blabr.io/?e8a066234715f21c21fd Regarding packaging a blab: yes, it's very simple to share a blab on the web. After editing the blab, just click "Save" at the top right. This will save the blab to a Github Gist. You'll then get a link to the blab, like the one above (for the compressive sensing blab). Share the link with anyone. There are two ways to save a blab: 1. Anonymous Gist - easiest way, no need for GitHub account, but no revision control (new gist for each save). 2. Gist under your GitHub username - full revision control (gist revision each time you edit and save your blab); can make gist public or private.

mtw 11y ago

I love it! Have shared with friends Is it possible to work and then have others "fork" the results? Like jsfiddle

gballan 11y ago
Thanks! Please try the "Fork" link at the bottom of a blab. You can either save as a public gist or (with a token from GitHub) a private gist. We have some ideas about merging forks, but nothing concrete yet.

theuttick 11y ago

I recently went went public with something similar - www.cadwolf.com Mine is similar in that it does math in the browser. However, the goal of cadwolf is to do math and documentation on the browser and remove the need for the user to know a programming language. I really like what you guys did, but why would someone use blabr to run coffeescript instead of just running their own program? What is the use case outside of a learning tool? Also, I would love to know what you think of cadwolf.

h2033485 11y ago

Is it possible to alter the lines in the plot? For example `pyplot.fill_between` I'm thinking of ipython notebook viewer (now Jupyter[0])which has a cool xkcd[1] plot example. [0]:http://nbviewer.ipython.org/ http://nbviewer.ipython.org/ [1]: http://nbtest.herokuapp.com/url/jakevdp.github.com/downloads/notebooks/XKCD_plots.ipynb http://nbtest.herokuapp.com/url/jakevdp.github.com/downloads...

gballan 11y ago
Short answer: yes. Long answer: any javascript library (plotting or otherwise) can potentially be used within blabr by creating a "widget" [0]. (Although the API for creating your own widgets is under construction.) For example, [1] extends the built-in plot function (both based on flot [2]). We already use d3.js, so I am sure we could create a widget for xkcd plots based on [3] (say). [0] http://blabr.io/?ff66265ccd580d6a9b04 http://blabr.io/?ff66265ccd580d6a9b04 [1] http://blabr.io/?7b662930a33b1053072a http://blabr.io/?7b662930a33b1053072a [2] http://www.flotcharts.org/ http://www.flotcharts.org/ [3] http://dan.iel.fm/xkcd/ http://dan.iel.fm/xkcd/

backspaces 11y ago

Where is the repo? A project here in Santa Fe may be a useful addition and I'd like to get in touch with the authors.